提交後Jquery表單選擇otion不會保存

Question

對於組合選擇的下拉選項，使用jquery腳本。該腳本工作正常，除了提交選定選項後不作爲選擇保存的事實，它默認回到每個下拉列表的第一個值。

我需要一些幫助。有沒有可以添加到我的現有帖子或其他替代方案中的解決方案。

即時通訊使用兩個腳本，一個用於雙向選擇雙滴（一滴取決於另一個），另一個腳本列出所有選項及其子選項。

這裏是第一個腳本的代碼：

(function($) { 
    $.fn.doubleSelect = function(doubleid, values, options) { 

     options = $.extend({ 
      preselectFirst: null, 
      preselectSecond: null, 
      emptyOption: false, 
      emptyKey: -1, 
      emptyValue: 'Choose...' 
     }, 
     options || {}); 

     var $first = this; 
     var $secondid = "#" + doubleid; 
     var $second = $($secondid); 

     var setValue = function(value) { 
      $second.val(value).change(); 
     }; 

     /** Helper Function to remove childs from second */ 
     var removeValues = function() { 
      $($secondid + " option").remove(); 
     }; 

     /** OnChange Handler */ 
     $(this).change(function() { 
      removeValues(); 
      var $current = this.options[this.selectedIndex].value; 
      if ($current !== '') { 
       $.each(values, 
       function(k, v) { 
        var bestk; 
        if ($current == v.key) { 
         $.each(v.values, 
         function(k, v2) { 
          if (!bestk && (v.defaultvalue !== null && v2 == v.defaultvalue)) { 
           bestk = k; 
          } 
          if (options.preselectSecond !== null && v2 == options.preselectSecond) { 
           bestk = k; 
          } 
         }); 
         $.each(v.values, 
         function(k, v2) { 
          var o = $("<option>").html(k).attr('value', v2); 
          if (options.preselectSecond) { 
          $.each(options.preselectSecond, 
           function(index, selected) { 
           if (v2 == selected) { 
            o.html(k).attr("selected", "selected"); 
           } 
           } 
          ); 
          } 
          if (k === bestk) { o.html(k).attr("selected", "selected"); } 
          o.appendTo($second); 
         }); 
        } 
       }); 

      } else { 
       setValue(options.emptyValue); 
      } 
     }); 

     return this.each(function() { 

      //remove all current items in select boxes 
      $first.children().remove(); 
      $second.children().remove(); 

      // Handle the empty option param 
      if (options.emptyOption) { 
       var oe = $("<option>").html(options.emptyValue).attr('value', options.emptyKey); 
       oe.appendTo($first); 
      } 

      // add all options to first select box 
      $.each(values, 
      function(k, v) { 
       var of = $("<option>").html(k).attr('value', v.key); 
       if (options.preselectFirst !== null && v.key == options.preselectFirst) { 
        of.html(k).attr("selected", "selected"); 
       } 
       of.appendTo($first); 

      }); 

      if (options.preselectFirst === null) { 
       var $current = this.options[this.selectedIndex].value; 
       if ($current !== '') { 
        $.each(values, 
        function(k, v) { 
         var bestk; 
         if ($current == v.key) { 
          $.each(v.values, 
          function(k, v2) { 
           if (!bestk && (v.defaultvalue !== null && v2 == v.defaultvalue)) { 
            bestk = k; 
           } 
           if (options.preselectSecond !== null && v2 == options.preselectSecond) { 
            bestk = k; 
           } 
          }); 
          $.each(v.values, 
          function(k, v2) { 
           var o = $("<option>").html(k).attr('value', v2); 
           if (k === bestk) { o.html(k).attr("selected", "selected"); } 
           o.appendTo($second); 
          }); 

         } 

        }); 

       } else { 
        setValue(options.emptyValue); 
       } 
      } else { 
       $first.change(); 
      } 

     }); 

    }; 
})(jQuery); 

這裏是從所述第二腳本的示例代碼：

$(document).ready(function() 
{ 

    var selectoptions = { 
      "Option 1": { 
       "key" : "Option 1", 
       "defaultvalue" : 1, 
       "values" : { 
        "sub-option 1": "sub-option 1", 
        "sub-option 2": "sub-option 2", 
        "sub-option 3": "sub-option 3" 

      } 
    }, 

"Option 2": { 
       "key" : "Option 1", 
       "defaultvalue" : 1, 
       "values" : { 
        "sub-option 1": "sub-option 1", 
        "sub-option 2": "sub-option 2", 
        "sub-option 3": "sub-option 3" 

      } 
    }, 

"Option 3": { 
       "key" : "Option 1", 
       "defaultvalue" : 1, 
       "values" : { 
        "sub-option 1": "sub-option 1", 
        "sub-option 2": "sub-option 2", 
        "sub-option 3": "sub-option 3" 

      } 
    }, 

}; 

     $('#first').doubleSelect('second', selectoptions); 

}); 

示例表單的HTML即時通訊使用的是：

<form action="" method="post" enctype="multipart/form-data"> 
<input type="hidden" name="action" value="1" /> 

<fieldset> 

<select type="text" name="address[state]" id="first" value="<?php // echo $_POST["address"]["state"]; ?>" class="short" tabindex="15"><option value="">--</option></select> 

<select type="text" name="address[city]" id="second" value="<?php // echo $_POST["address"]["city"]; ?>" class="short" tabindex="16"><option value="">--</option></select> 

</fieldset>       

<input type="submit" name="submit" id="submit" class="button grey" tabindex="15" value="<?php echo SPEC($GLOBALS['_LANG']['_tpl_myaccount33']) ?>" /> 

</form> 

感謝您對此問題的任何幫助。欣賞它。

Answer 1

難道是因爲你的表格沒有action？