diff --git a/ipi-survey-platform/src/components/survey/ProductData/ProductData.jsx b/ipi-survey-platform/src/components/survey/ProductData/ProductData.jsx
index c8eb7dd..5a483e2 100644
--- a/ipi-survey-platform/src/components/survey/ProductData/ProductData.jsx
+++ b/ipi-survey-platform/src/components/survey/ProductData/ProductData.jsx
@@ -499,10 +499,9 @@ const ProductData = ({
           const selectedProduct = options?.find(opt => opt.value === value);
           const updatedProduct = {
             ...product,
-            product: value,
+            product: selectedProduct?.value || value,
             productName: selectedProduct?.label || '',
-            productId: selectedProduct?.value || '',
-            [field]: value
+            productId: selectedProduct?.value || ''
           };
           
           // Fetch previous forecast data when product is selected
@@ -807,23 +806,76 @@ const ProductData = ({
                   <Select
                     placeholder={isLoadingProducts ? 'Loading products...' : 'Select product HS code'}
                     options={productOptions}
-                    value={p.product || ''}
-                    onChange={(e) => {
+                    value={p.productId || p.product || ''}
+                    onChange={async (e) => {
+                      const selectedValue = e.target.value;
                       // Clear error when user selects a product
                       if (formErrors[`product_${idx}`]) {
                         const newErrors = { ...formErrors };
                         delete newErrors[`product_${idx}`];
                         setFormErrors(newErrors);
                       }
-                      updateProductField(p.id, 'product', e.target.value, productOptions);
+                      // Find the selected product from options
+                      const selectedProduct = productOptions.find(opt => opt.value === selectedValue);
+                      // Update the product with all necessary fields
+                      const updatedProduct = {
+                        ...p,
+                        product: selectedProduct?.value || selectedValue,
+                        productName: selectedProduct?.label || '',
+                        productId: selectedProduct?.value || selectedValue
+                      };
+                      // Update the products array with the updated product
+                      const updatedProducts = products.map(prod => 
+                        prod.id === p.id ? updatedProduct : prod
+                      );
+                      onProductsChange(updatedProducts);
+
+                      // After updating the product, fetch forecast data if we have a valid product and establishment ID
+                      if (selectedProduct?.value) {
+                        try {
+                          // Get establishment ID from sessionStorage or localStorage
+                          const establishmentId = sessionStorage.getItem('establishment_id') || 
+                                               localStorage.getItem('establishmentId') ||
+                                               localStorage.getItem('establishment_id');
+                          
+                          if (establishmentId && quarter && year) {
+                            const selectedProductId = selectedProduct.originalData?.id || selectedProduct.value;
+                            const forecastData = await fetchPreviousForecastData(selectedProductId, establishmentId, p.id);
+                            
+                            if (forecastData) {
+                              const data = forecastData.data || forecastData;
+                              const updatedWithForecast = {
+                                ...updatedProduct,
+                                octQuantity: data.previous_quantity_period_one || '',
+                                novQuantity: data.previous_quantity_period_two || '',
+                                decQuantity: data.previous_quantity_period_three || '',
+                                octCost: data.previous_cost_period_one || '',
+                                novCost: data.previous_cost_period_two || '',
+                                decCost: data.previous_cost_period_three || '',
+                                capacity: data.annual_installed_capacity || ''
+                              };
+                              
+                              const finalUpdatedProducts = updatedProducts.map(prod => 
+                                prod.id === p.id ? updatedWithForecast : prod
+                              );
+                              
+                              onProductsChange(finalUpdatedProducts);
+                            }
+                          }
+                        } catch (error) {
+                          console.error('Error fetching forecast data:', error);
+                        }
+                      }
                     }}
                     loading={isLoadingProducts}
                     disabled={isLoadingProducts}
                     error={!!formErrors[`product_${idx}`]}
                   />
-                  {formErrors[`product_${idx}`] && (
-                    <p className="mt-1 text-sm text-red-600">{formErrors[`product_${idx}`]}</p>
-                  )}
+                  <div className="h-5">
+                    {formErrors[`product_${idx}`] && (
+                      <p className="text-sm text-red-600">{formErrors[`product_${idx}`]}</p>
+                    )}
+                  </div>
                 </div>
                 {productsError && productOptions.length === 0 && (
                   <p className="mt-1 text-xs text-red-600">{productsError}</p>
@@ -838,12 +890,11 @@ const ProductData = ({
                   onChange={(e) => updateProductField(p.id, 'unit', e.target.value, unitOptions)}
                   error={!!formErrors[`unit_${idx}`]}
                 />
-                {formErrors[`unit_${idx}`] && (
-                  <p className="mt-1 text-xs text-red-600">{formErrors[`unit_${idx}`]}</p>
-                )}
-                {!formErrors[`unit_${idx}`] && unitsError && unitOptions.length === 0 && (
-                  <p className="mt-1 text-xs text-red-600">{unitsError}</p>
-                )}
+                <div className="h-5">
+                  {formErrors[`unit_${idx}`] && (
+                    <p className="text-xs text-red-600">{formErrors[`unit_${idx}`]}</p>
+                  )}
+                </div>
               </div>
               <div>
                 <label className="block text-sm font-medium text-gray-700 mb-1">Annual installed capacity (in unit) <span className="text-red-500">*</span></label>
@@ -855,9 +906,11 @@ const ProductData = ({
                   required
                   error={!!formErrors[`capacity_${idx}`]}
                 />
-                {formErrors[`capacity_${idx}`] && (
-                  <p className="mt-1 text-xs text-red-600">{formErrors[`capacity_${idx}`]}</p>
-                )}
+                <div className="h-5">
+                  {formErrors[`capacity_${idx}`] && (
+                    <p className="text-xs text-red-600">{formErrors[`capacity_${idx}`]}</p>
+                  )}
+                </div>
               </div>
             </div>