獲取JQuery對話框值來解決問題

Question

我有一個簡單的模式jQuery對話框彈出窗口，收集地址信息，我需要傳遞給後面的代碼保存到數據庫後，用戶輸入它。我已經搜索了數百個示例，並且目前處於下面的點，但似乎無論我做什麼，創建的JSON字符串都顯示「undefined」，表示我試圖傳遞的所有字段。我的結論是，我用來在jQuery中構建JSON字符串的方法是錯誤的，但是嘗試了很多種方法來完成此操作後，它們都無法工作。我試圖通過ID使用各種方式訪問​​字段，但類和如下所示。這裏是代碼片段。任何人都可以看到我出錯的地方嗎？

<script type="text/javascript"> 
    $(function() { 
     $('#dialog').dialog({ 
      draggable: true, 
      resizeable: false, 
      autoOpen: false, 
      height: 700, 
      width: 550, 
      modal: true, 
      top: 0, 
      left: 0, 
      title: 'Edit Information', 
      buttons: { 
       'Save': function() {       
        $('#ibSaveInfo').click(); 
       }, 
       'Cancel': function() { 
        $(this).dialog('close'); 
       } 
      } 
     }).parent().css('z-index', '1005'); 
    }); 

    $(document).on("click", "#ibSaveInfo", function() { 
     var inputArray = new Array; 
     var idx = 0; 

     inputArray[idx] = 'Address1:' + $("#dialog").find("#txtAddress1").val(); 

     idx++; 
     inputArray[idx] = 'Address2:' + $("#txtAddress2").val(); 

     idx++; 
     inputArray[idx] = 'city:' + $("txtcity").val(); 

     etc, etc 

     var inputArrayList = "{ inputArray: " + JSON.stringify(inputArray) + "}"; 
     $.ajax({ 
      type: "POST", 
      dataType: "json", 
      contentType: "application/json", 
      url: "Address.aspx/SaveInfo", 
      data: inputArrayList, 
      success: function (data) { 
       //debugger; 

       if (data.d.indexOf("Error") != -1) { 
       } 
       else { 
        $("#ResultLabel").show(); 
        $("#ResultLabel").text("Sum of all the contents is: " + data.d); 
       } 
      }, 
      error: function (e, ts, et) { 
       //debugger; 
       alert(ts); 
      } 
     }); //ajax func end 
    }); 

    $(document).ready(function() { 
     $("#ibEdit").click(function (e) { 
      $('#dialog').dialog('option', 'position', [e.pageX + 10, e.pageY + 10]); 
      $('#dialog').dialog('open'); 
     }); 
    }); 


<div id="dialog" style="padding-left: 10px; padding-bottom: 15px;"> 
    <asp:TextBox runat="server" ID="txtAddress1" ClientIDMode="Static" /> 
    <asp:TextBox runat="server" ID="txtAddress2" ClientIDMode="Static" /> 
    <asp:TextBox runat="server" ID="txtCity" ClientIDMode="Static" /> 
    etc, etc 
</div> 

Answer 1

我剛剛創建了您的具體代碼的jsfiddle：

http://jsfiddle.net/PfgQy/

這似乎與city表單字段以外來工作，因爲它缺少一個＃，它的情況下是不正確（應該有一個大寫字母C）。

$("#txtCity").val(); 

如果你所有的領域仍然中斷，則是你還沒有規定，是造成問題的網頁上別的東西。

希望這會有所幫助。

戴夫

Answer 2

編輯： 只要你使用ASP文本框的注意。隨着元素的ID改變。如果您無意從服務器訪問這些值，請嘗試使用常規的<input>文本框。

，而不是這個

idx++; 
     inputArray[idx] = 'city:' + $("txtcity").val(); 

你應該使用的Array.push函數。

var inputArray = []; 
inputArray.push('Address1:' + $("#txtAddress1").val()); 
inputArray.push('Address2:' + $("#txtAddress2").val();) 
inputArray.push('city:' + $("txtcity").val()); 

也是在這裏，而不是在你的代碼調用clickfunction，只要給它引用到另一個功能

$(function() { 
     $('#dialog').dialog({ 
      draggable: true, 
      resizeable: false, 
      autoOpen: false, 
      height: 700, 
      width: 550, 
      modal: true, 
      top: 0, 
      left: 0, 
      title: 'Edit Information', 
      buttons: { 
       'Save': save(), 
       'Cancel': function() { 
        $(this).dialog('close'); 
       } 
      } 
     }).parent().css('z-index', '1005'); 
    }); 

function save(){ 
    var inputArray = []; 
    inputArray.push('Address1:' + $("#txtAddress1").val()); 
    inputArray.push('Address2:' + $("#txtAddress2").val()); 
    inputArray.push('city:' + $("#txtCity").val()); 
    var json = { "inputArray": inputArray}; 
     inputArrayList = JSON.stringify(json); 
//ajax stuff 
} 

還你有2個文件準備功能，使您可以結合這些。這兩種都是聲明文檔準備就緒的方法。

$(document).ready(function(){}); 
$(function() {});