jQuery加载未填充select元素


jQuery load not populating select element

我有一段代码,当页面加载时,调用mysql并用数据填充select元素。这在初始加载或刷新页面时效果良好,但当我从ajax获得成功回调时,我要做的是用新数据更新或重新填充select元素。

我可以看到数据是从firebug中的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");
        }
      }
    });
  }
}

要重新填充select中的Options,您可以(清空)select中的选项,并(附加)从数据库中创建的新选项。

演示

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);
});

我在使用$.get时遇到了类似的问题。

我试图加载一个模板,从以前成功的ajax回调中添加data,我用这种方式解决了问题:

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

但正如我所说,我不知道它是否能解决你的问题。

在我的情况下,我试图获取的页面被缓存了。