jQuery加载不填充选择元素

Question

我有代码，当页面加载时，调用mysql和填充数据的select元素。这可以在初始加载或刷新页面时正常工作，但我试图做的是，当我从ajax获得成功回调时，将使用新数据更新或重新填充select元素。

我可以看到数据正从瓢虫中的ajax返回，但由于某种原因，未填充select元素。如果有人能发现我已经搞砸了，我将不胜感激。非常感谢。

PHP/HTML代码

<div class="fieldset"> 
      <h1><span>Select Your Box(es)</span></h1> 
      <p> 
       <select data-placeholder="Choose your box(es)..." class="chosen-select" name="box_frtv[]" id="box_frtv" multiple required="required"> 
       <option value=""></option> 
       <?php 
        do { 

        ?> 
       <option value="<?php echo $row_rs_fbrtv['boxref']; ?>"><?php echo $row_rs_fbrtv['boxref']; ?></option> 
       <?php 
        } while ($row_rs_fbrtv = mysql_fetch_assoc($rs_fbrtv)); 

        $rows = mysql_num_rows($rs_fbrtv); 

        if($rows > 0) { 

        mysql_data_seek($rs_fbrtv, 0); 

        $row_rs_fbrtv = mysql_fetch_assoc($rs_fbrtv); 

        } 

        ?> 
       </select><span></span><div id="boxError"></div> 
      </p> 
      </div> 

jQuery代码

submitHandler: function() 
{ 
    if ($("#USRfilertv").valid() === true) 
    { 
    var data = $("#USRfilertv").serialize(); 

    $.ajax(
    { 
     type: "POST", 
     url: "frtv.php", 
     data: data, 
     dataType: "json", 

     success: function (data) 
     { 
     if (data.opp == 'error') 
     { 
      var messageOutput = ''; 
      for (var i = 0; i < data.length; i++) 
      { 

      messageOutput += data[i].file + ' '; 

      } 

      notif({ 
      msg: "There was an error retrieving the following file: " + '<br /><br />' + '<b><font color=\"black\">' + data.file + '</font></b><br /><br />' + ' Please correct this error and try again.<br />If this error persists, please contact us quoting ref: ' + '<b><font color=\"#fbf66a\">' + '#FRTV0001.<br />' + '</font>' + '<br />' + 'Thank you.', 
      type: "frtvError", 
      position: "center", 
      width: 490, 
      height: 75, 
      multiline: true, 
      timeout: 6000, 
      opacity: 0.8, 
      fade: 10, 
     }); 
     } 
     else 
     { 
      var messageOutputs = ''; 
      for (var i = 0; i < data.length; i++) 
      { 

      messageOutputs += data[i].file + ' '; 

      } 

      $("#USRfilertv").get(0).reset(); 
      $("#box_frtv").load("refreshFrtv.php"); 
      $("#frtv_address").trigger("chosen:updated"); 

      notif({ 
      msg: "You have successfully retrieved the following file(s)." + '<br /><br />' + '<b><font color=\"black\">' + data.file + '</font></b><br /><br />' + ' These file(s) were successfully entered into the database.<br />Thank you.', 
      type: "FileRtvSuccess", 
      position: "center", 
      width: 440, 
      height: 75, 
      multiline: true, 
      timeout: 6000, 
      opacity: 0.8, 
      fade: 10, 
     }); 
     $("#box_frtv_chosen").find('option:selected').remove(); 
     $("#box_frtv").html(''); 
     $("#box_frtv").trigger("chosen:updated"); 
     $("#box_ffrtv_chosen").find('option:selected').remove(); 
     $("#box_ffrtv").html(''); 
     $("#box_ffrtv").trigger("chosen:updated"); 
     } 

     } 

    }); 
    } 
} 

Answer 1

要重新填充选项中的选项，您可以（清空）从数据库中选择和（附加）您创建的新选项中的选项。

演示

http://jsfiddle.net/48v5ufca/

jQuery的

$("#clickme").on("click", function(e) { 
var messageOutputs = ''; 
      for (var i = 0; i < 10; i++) 
      { 

      messageOutputs += '<option value="">New'+i+'</option>'; 


      } 

$("#box_frtv").empty(); 
$("#box_frtv").append(messageOutputs); 
}); 

Answer 2

我使用$.get有类似的问题。

我试图加载模板从以前的成功Ajax回调添加data，我以这种方式解决：

var t; 
$.get('/js/template/page_01.mst', 
    { t: new Date().getTime() }, // I added this var in here 
    function(template) { 
     // etc... 
    }); 

但正如我所说，我不知道它是否能够解决您的问题。

在我的情况下，我试图得到的页面被缓存。