2013-10-07 44 views
-3

此代碼獲取值是http://jsfiddle.net/EuyB8/從克隆的元素

<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title> - jsFiddle demo</title> 

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.js"></script> 

    <link rel="stylesheet" type="text/css" href="/css/normalize.css"> 
    <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 

    <style type="text/css"> 
    #TemplateRow { display:none; } 

table, tr, td, th { border: solid thin black; padding: 5px; } 

    </style> 



<script type="text/javascript">//<![CDATA[ 

$(function() { 
    //attach the a function to the click event of the "Add Box Attribute button that will add a new row 
    $('#AddAttr').click(function() { 
     //clone the template row, and all events attached to the row and everything in it 
     var $newRow = $('#TemplateRow').clone(true); 

     //strip the IDs from everything to avoid DOM issues 
     $newRow.find('*').andSelf().removeAttr('id'); 

     //add the cloned row to the table immediately before the last row 
     $('#BoxTable tr:last').before($newRow); 

     //to prevent the default behavior of submitting the form 
     return false; 
    }); 

    //attach a remove row function to all current and future instances of the "remove row" check box 
    $('#DeleteBoxRow').click(function() { 
     //find the closest parent row and remove it 
     $(this).closest('tr').remove(); 
    }); 

    //finally, add an initial row by simulating the "Add Box Attribute" click 
    $('#AddAttr').click(); 
}); 

//]]> 

</script> 


</head> 
<body> 
    <table id="BoxTable"> 
    <tbody><tr> 
     <th>Name</th> 
     <th>Nationality</th> 
     <th>Relationship</th> 
     <th>Date of Birth</th> 
    </tr> 
    <tr id="TemplateRow"> 
     <td> 
      <select name="BoxName" id="BoxName"> 
       <option selected="selected" value="attr1">attr1</option> 
       <option value="attr2">attr2</option> 
       <option value="attr3">attr3</option> 

      </select> 
     </td> 
     <td> 
      <select name="BoxComparison" id="BoxComparison"> 
       <option selected="selected" value="=">=</option> 
       <option value=">">&gt;</option> 
       <option value="<">&lt;</option> 
       <option value="Like">Like</option> 
       <option value="!=">!=</option> 
      </select> 
     </td> 
     <td> 
      <input name="BoxVal" id="BoxVal" type="text"> 
     </td> 
     <td> 
      <input id="DeleteBoxRow" name="DeleteBoxRow" type="checkbox"> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="4"> 
      <input name="AddAttr" value="Add Box Attribute" id="AddAttr" type="submit"> 
     </td> 
    </tr> 
</tbody></table> 
</body> 

我怎樣才能生成的所有行的所有值,並把它們放在一個C#數組?

+0

我是新來的JQuery 。請留下一個答案或評論澄清,而不是投票下來。我只需要幫助。 –

+0

我想這是因爲你寫了1個鏈接,1個問題和100行代碼。提供一些關於您的問題的更多信息將會更好 – colosso

+0

我明白了。謝謝。 –

回答

1

我有一個解決方案,但在我的oppinion它有點hacky。既然你提到c#我假設你正在開發一個ASP.NET應用程序。如果這就是這樣做的一種方法:

首先在您的頁面上放置一個不可見的文本框控件。這裏重要的是你用css隱藏它。如果你將可見屬性設置爲false,它不會在你的頁面上,你不能在其中任何東西。

一旦添加了文本框,您將創建一個新的jQuery函數,它將行的值添加到隱藏的文本框控件中。你可以在你的'提交'按鈕上用mousedown事件來做它,或者你可以在'change'事件中隨時做。

你必須做的最後一件事是你必須添加分隔符到行值,你可以將它們拆分回到一個數組在c#中。

TextBox控件的值將這個樣子到底:

ValueRow1|ValueRow2|ValueRow3 
在C#

返回其易於值分成數組:

string[] myArr = textbox1.Text.Split('|'); 
+0

感謝您對Colosso的迴應。我很感激。我會試試這個。 –