MVC3在javascript中增加一個變量（jquery）

我試圖在每次向表單添加內容時在表格中添加一個新行的表格。這是我的代碼，然後我會告訴問題是什麼。MVC3在javascript中增加一個變量（jquery）

@{ 
    //Declare the i variable 
    var i = 0; 
} 

@using (Html.BeginForm()) 
{ 
    <table> 
     <tr> 
      <th> 

      </th> 
      <th> 
       Question 
      </th> 
     </tr> 
     <tr id="@(i+1)"> 
      <td class="QuestionNum"> 
       @(i+1)) 
      </td> 
      //This is the cell with the Form field. 
      <td> 
       @Html.TextBoxFor(m => m.Questions[i].Question, new { @class = "QuestionBox Last" }) 
      </td> 
     </tr> 
    </table> 
} 

<script> 
    $(document).ready(function() { 
     SetUpNewLine($('.QuestionBox')); 
    }); 

    function SetUpNewLine(obj) { 
     obj.bind('keyup paste', function() { 
      if ($(this).val() != "") { 
       if ($(this).hasClass("Last")) { 

        //This is the line that isn't working. 
        @(i++) 

        $(this).parents('table').append('<tr id="@(i+1)"><td class="QuestionNum">@(i+1))</td><td>@Html.TextBoxFor(m => m.Questions[i], new { @class = "QuestionBox Last", style="width:100%;" })</td></tr>'); 
        $(this).removeClass('Last'); 
        SetUpNewLine($('.Last')); 
      } 
     }); 
    } 
</script>

所以，這個代碼工作的第一次，但在JavaScript函數調用@(i++)時，一旦你的功能外它不保存變量的變化。因此，在第一個Html.TextBoxFor（用於Model.Questions對象中的第一個項目）之後，它確實創建了一個像我想要的新文本框，但不是增加它在List中更改的項目，而是使它們都只是編輯列表中的第二項。

奇怪的是，如果我要在$(document).ready()內部做@(i++)，那麼它可以正常工作。

關於如何正確增加變量的任何想法？我敢肯定，當涉及到混合Razor變量和Javascript時，我只是不知道。

來源

2012-07-19 Charlie Pugh

您需要將服務器呈現的值i存儲在javascript中。

編輯這是錯誤的。您將無法像您正在嘗試的那樣使用剃刀語法附加到您的元素。 Razor是一種服務器端模板語言，一旦它被解釋爲HTML，您可以從客戶端渲染更多的HTML。

EDIT 2 嘗試類似如下：

var current_index = (@i); 

    $(document).ready(function() { 
     SetUpNewLine($('.QuestionBox')); 
    }); 

    function getHtml(index){ 
     return '<tr id="' +index + '"><td class="QuestionNum">'+ index +'</td><td><input type="text" name="Question" class="QuestionBox Last" style="width:100%;"/></td></tr>'; 
    } 

    function SetUpNewLine(obj) { 
     obj.bind('keyup paste', function() { 
      if ($(this).val() != "") { 
       if ($(this).hasClass("Last")) { 

        //This is the line that isn't working. 
        current_index++; 

        $(this).parents('table').append(getHtml(current_index); 
        $(this).removeClass('Last'); 
        SetUpNewLine($('.Last')); 
      } 
     }); 
    }

來源

2012-07-19 17:36:00 scottm

那麼我會如何將變量放入HtmlHelper？ – 2012-07-19 17:37:43

哦，所以在Javascript中，而不是使用HtmlHelper，我應該硬編碼，以便它適合回發模型？ – 2012-07-19 17:41:08

是的。 MVC將使用模型聯編程序爲您填充模型。 – scottm 2012-07-19 17:42:59

將變量的值存儲在隱藏表單字段中，所以當表單發佈到服務器時，也會發送此變量的增量值。

<input type="hidden" name="incrementedVar" value="1" />

Javascript功能來增加它：

$("input[name='incrementedVar']").val($("input[name='incrementedVar']").val() + 1);

，並在控制器

public ActionResult MyAction(int incrementedVar) 
{ 
    // the incrementedVar param matches the name of the hidden field. 
    // the model binder will automatically pass the value of the hidden field to this param. 
}

獲得的價值使用此代碼中，變量是由JavaScript的完全控制，並且服務器只獲得在回發中訪問它。您需要刪除剃鬚刀聲明並遞增您當前擁有的代碼。

來源

2012-07-19 17:24:46

我不想回發到服務器我想一個新行，雖然每次都會顯示。 – 2012-07-19 17:26:01

只有當您提交表單時，它纔會每次都回傳。如果你不需要訪問服務器端的計數器，你可以使用JavaScript var並增加它。 – 2012-07-19 17:27:30

如果我使用JavaScript變量，那麼我不能將它放入Html.TextBoxFor作爲它在數組中編輯的項目的索引嗎？ – 2012-07-19 17:34:55

MVC3在javascript中增加一個變量（jquery）

回答

相關問題