使用jQuery保存彈出窗口數據

Question

我正在使用「Create New」選項下拉菜單。如果用戶點擊「新建」選項，彈出窗口將顯示保存按鈕。在該彈出窗口中，用戶將輸入數據並在用戶將該數據保存在服務器上之後。

這是用於將數據保存在彈出窗口中的jQuery函數。

<script type = "text/javascript" > 
    function savefile() { 

    $(document).ready(function() { 
     $('#Savefile').click(function() { 
     $.ajax({ 
      url: 'D:\C#.Net\Scramble.txt', 
      datatype: "json", 
      method: 'post', 
      data : scrtabledata, 
      success: function() { 
      var scrtabledata = $('#modaltable'); //Table ID 
      scrtabledata.empty(); 
      $(data).each(function() { 
       scrtabledata.append('<tr><td>' + scrtabledata.comment + '</td><td>' + scrtabledata.DropDownList2 + '</td><td>' + scrtabledata.DropDownList1 + '</td></tr>'); 
      }); 
      } 
     }); 
     }); 
    }); 
    }; 
</script> 

而且通過像這樣的腳本，

<button runat="server" id="Savefile" class="btn btn-primary" onclick="savefile()">Save </button> 

這是jQuery的彈出代碼：

<script type="text/javascript"> 
$(function() { 
     //Attach click event to your Dropdownlist 
     $("#<%= DropDownConfigFile.ClientID %>").change(function() { 
      //Get the selected valu of dropdownlist 
      selection = $(this).val(); 
      //If its one then show the dialog window. You can change this condition as per your need 
      if (selection == 1) { 
       //Show the modal window 
       $('#myModal').modal('show'); 

      } 
     }); 
    }); 
</script> 

當用戶點擊「保存」按鈕，然後數據在該存儲給定路徑。但它沒有執行任何操作。當我點擊「保存」按鈕時它會自動關閉。你能幫我解決這個問題嗎？

此代碼有任何錯誤？

Answer 1

試試：

<script type="text/javascript"> 
     function savefile() { 
        $.ajax({ 
         url: 'D:\C#.Net\Scramble.txt', 
         datatype: "json", 
         method: 'post', 
         success: function() { 
          var scrtabledata = $('#modaltable');//Table ID 
          scrtabledata.empty(); 

          $(data).each(function() { 
           scrtabledata.append('<tr><td>' + scrtabledata.comment + '</td><td>' + scrtabledata.DropDownList2 + '</td><td>' + scrtabledata.DropDownList1 + '</td></tr>'); 
          }); 

         } 

        }); 
     } 
    </script> 

Answer 2

你需要傳遞的數據在AJAX功能的順序進行保存。

$(document).ready(function() { 
       $('#Savefile').click(function() { 
        $.ajax({ 
         url: 'D:\C#.Net\Scramble.txt', 
         datatype: "json", 
         data : Your Data to be passed, 
         method: 'post', 
         success: function() { 
          var scrtabledata = $('#modaltable');//Table ID 
          scrtabledata.empty(); 

          $(data).each(function() { 
           scrtabledata.append('<tr><td>' + scrtabledata.comment + '</td><td>' + scrtabledata.DropDownList2 + '</td><td>' + scrtabledata.DropDownList1 + '</td></tr>'); 
          }); 

         } 

        }); 
       }); 
      }); 
     }; 

這裏在數據屬性中，您需要將您的數據以json格式作爲關鍵值對傳遞。

var myData={"id":"1","Name":"Test"} 

以這種方式，您可以形成自己的JSON並將其傳遞給您的ajax函數。

你必須考慮像 如果

<input type="text" id="userId"/> 
<input type="text" id="userData"/> 

var userID=$('#userId').val(); 
var userData=$('#userData').val(); 
    $(document).ready(function() { 
       $('#Savefile').click(function() { 
        $.ajax({ 
         url: 'D:\C#.Net\Scramble.txt', 
         datatype: "json", 
         data : { 
           id:userID, 
           info:userData 
           }, 
         method: 'post', 
         success: function() { 
          var scrtabledata = $('#modaltable');//Table ID 
          scrtabledata.empty(); 

          $(data).each(function() { 
           scrtabledata.append('<tr><td>' + scrtabledata.comment + '</td><td>' + scrtabledata.DropDownList2 + '</td><td>' + scrtabledata.DropDownList1 + '</td></tr>'); 
          }); 

         } 

        }); 
       }); 
      }); 
     }; 

更新