簡體   English   中英

添加新項目后重新填充選擇菜單

[英]Repopulate select menu after adding new item

我環顧四周,看不到任何適合我需求的東西。 基本上,一旦添加項目,我就會嘗試刷新選擇菜單(而不是整個頁面)。 我目前有一個ajax查詢,允許用戶添加一個新文件夾,效果很好。 添加后,我希望將該文件夾選項添加到選擇菜單。 下面是我的代碼:

HTML:

<form>
<select id="basic-combo" name="basic-combo" size="1" onchange="showFolders(this.value)">
  <?php
     foreach ($folder as $t)
     {
       echo '<option value="'.$t['folder_id'].'">'.$t['name'].'</option>';
     }
   ?>  
 </select>
 </form>

 // This is the popup form to add a new folder
 <div style="float:right; margin-top:10px;">
        <div class="messagepop pop">
            <form method="post" id="new_folder" >
                <p><label for="folder">Folder Name</label><input type="text" size="20" maxlength="13" name="folder_name" id="folder_name" /></p>
                <p><input type="submit" value="Add" id="message_submit"/> or <a class="close" href="/">Cancel</a></p>
            </form>
        </div>

      <a href="#" id="add" title="Add Folder" class="icon-plus icon-black"></a>
      <a href="#" title="Delete Folder" class="icon-minus icon-black"></a>
      <a href="#" title="Edit Folder" class="icon-folder-open icon-black" ></a>
  </div>

Javascript:

$("#message_submit").on("click", function(e){
    e.preventDefault();
      var data = $("p").find("#folder_name").val()
      console.log(data); // Testing data

     $.ajax({
        url: '<?php echo base_url().'account/members_home/add_folder';?>', 
        type: 'POST',
        data: { val: data },
        success: function(output_string){
            $(".success").text("Your folder was added!!").show().css({"color" : "green", "margin-top" : "10px"});
            $(".success").fadeOut(10000);
        }
      });

    deselect();
    $.ajax({
      url: '<?php echo base_url().'account/members_home/getFolderID';?>', 
      type: 'POST',
      data: { val1: data },
      dataType: 'json',  
      success: function(output_string){
         console.log(output_string['folder_id'][0]); // The request works
         showFolders(output_string['folder_id'][0]);

          // THIS IS THE PART WHERE I AM TRYING TO REPOPULATE THE SELECT MENU
         var newSelect = $('<option value="' + output_string['folder_id'][0] + '" >' + data + '</option>');
         $('#basic-combo').append(newSelect);
         $("#basic-combo option[value='" + output_string['folder_id'][0] + "']").attr('selected', 'selected'); 
       }
    });   

});

嘗試這個:

var mySelect = $('#basic-combo');
mySelect.append(
    $('<option></option>').val(output_string['folder_id'][0]).html('folder name goes here').attr("selected", "selected")
);

我最終將其用於想要知道的那些人:

$('#folder_select').append(
     $('<option></option>', {value: val2, text: data})).val(val2);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM