如何使用razor生成的Id调用jQuery函数?

如何使用razor生成的Id调用jQuery函数?,jquery,razor,Jquery,Razor,我有一个生成表的razor页面,我想在单击行图像时打开一个对话框并插入注释。该表此时有5行 以下是tbody标签内的修订代码: <tbody> @for (int i = 0; i < 5; i++) { string dropDownAccountName = "dropDownAccountsR" + CasWtsUI.Utility.PadWithZero(@i.ToString(), 3); string dropDownPa

我有一个生成表的razor页面,我想在单击行图像时打开一个对话框并插入注释。该表此时有5行

以下是tbody标签内的修订代码:

  <tbody>
    @for (int i = 0; i < 5; i++)
    {
      string dropDownAccountName = "dropDownAccountsR" + CasWtsUI.Utility.PadWithZero(@i.ToString(), 3);
      string dropDownPayType = "dropDownPayTypesR" + CasWtsUI.Utility.PadWithZero(@i.ToString(), 3);
      string showComment = "showCommentR" + CasWtsUI.Utility.PadWithZero(@i.ToString(), 3);
      string openComment = "openCommentR" + CasWtsUI.Utility.PadWithZero(@i.ToString(), 3);
      string aComment = "aCommentR" + CasWtsUI.Utility.PadWithZero(@i.ToString(), 3);
      <tr style="background-color: #ffffff; padding-left: 5px; height: 14pt">
        <td id="commentContainer" align="center">
          <a id="@showComment" name="@showComment" class="showComment" href="#">
            <img src='@Url.Content("~/Content/Images/NotepadIcon.jpg")' height="20px" width="20px" style="border:none; text-decoration:none"
       alt="Add a Comment for this Account" /></a>
        </td>
        <td align="left">
          <select id="@dropDownAccountName" name="@dropDownAccountName" style="font-size:9pt; width:120px">
            @foreach (CasWtsUI.AccountTitle accountTitle in Model.Accounts)
            {
              <option value="@accountTitle.ID">@accountTitle.Title</option>
            }
          </select>
        </td>
        <td align="left">
          <select id="@dropDownPayType" name="@dropDownPayType" style="font-size:9pt; width:90px" >
            @foreach (CASCommon.PayType payType in Model.PayTypes)
            {
              <option value="@payType.ID">@payType.Type</option>
            }
          </select>
        </td>
        @for (int dayOffset = 0; dayOffset < inputDays; dayOffset++)
        {
          System.DateTime entryDate = firstDate.AddDays(dayOffset);
          string textBoxHours = "textBoxHoursR" +
            CasWtsUI.Utility.PadWithZero(@i.ToString(), 3) + "D" +
            CasWtsUI.Utility.PadWithZero(entryDate.Year.ToString(), 4) +
            CasWtsUI.Utility.PadWithZero(entryDate.Month.ToString(), 2) +
            CasWtsUI.Utility.PadWithZero(entryDate.Day.ToString(), 2);
          <td align="center" style="width: 70px; font-size: 9pt">
            @{string theDay = entryDate.DayOfWeek.ToString();
              var backColor = "#ffffff"; }
            @if (theDay == "Saturday" || theDay == "Sunday")
            {
              backColor = "#f0f0f2";
            }
            <input type="text" id="@textBoxHours" name="@textBoxHours" style="width: 0.35in; background-color: @backColor"  />
          </td>
        }
      </tr>
      <tr>
            <td id="@openComment" class="showComment" colspan="20" style="text-align: left; padding-left: 40px;
              width: 500px; display: none">
              Enter a Comment about this account:&nbsp;&nbsp;&nbsp;&nbsp;
          <input id="@aComment" name="@aComment" type="textbox" size="120" style="color:blue; background-color:#f0f0f2" />
        </td>
      </tr>

    }
  </tbody>

@对于(int i=0;i<5;i++)
{
字符串dropdowncountname=“dropdowncountsr”+CasWtsUI.Utility.PadWithZero(@i.ToString(),3);
字符串dropDownPayType=“dropDownPayTypesR”+CasWtsUI.Utility.PadWithZero(@i.ToString(),3);
字符串showcoment=“showcomentr”+CasWtsUI.Utility.PadWithZero(@i.ToString(),3);
字符串openComment=“openCommentR”+CasWtsUI.Utility.PadWithZero(@i.ToString(),3);
字符串aComment=“aCommentR”+CasWtsUI.Utility.PadWithZero(@i.ToString(),3);
@foreach(Model.Accounts中的CasWtsUI.AccountTitle AccountTitle)
{
@会计职称,职称
}
@foreach(Model.PayTypes中的CASCommon.PayType PayType)
{
@付款方式,付款方式
}
@对于(int dayOffset=0;dayOffset
这是我的点击功能

<script src='@Url.Content("~/Scripts/jquery-ui-1.8.17.custom.min.js")' type="text/javascript"></script>
<script type="text/javascript">
  $(document).ready(function () {
    $(".showComment").click(function (e) {
      $('#openComment').toggle('fade');
    });
  });
</script>

$(文档).ready(函数(){
$(“.showComment”)。单击(函数(e){
$('openComment')。切换('fade');
});
});

我看到的第一个问题是,您试图将单击事件绑定到
#showcoment
。查看正在呈现的HTML,ID可能如下所示:
#showcomentr001
,这就是为什么单击事件没有触发的原因。相反,你会想要这样的东西:

$(document).ready(function() {
    var $commentDialog = $("#Comment");
    $(".showComment").click(function() {
        $commentDialog.dialog("open");
    });

    $commentDialog.dialog({
        autoOpen: false,
        show: "fadeIn",
        modal: true
    });
});​

这是一个类似于在视图中获得输出的函数。

是否要在函数中使用id?是@showComment吗?你能粘贴生成的html吗?顺便说一句,它首先使用
$(“.showcoment”)。单击(函数(e){
intead of
$(“#showcoment”)。单击(函数(e){
我在设计上做了一些更改,但仍然存在相同的问题。比尔的建议帮助我打开了至少一个事件,这可能是因为我缺乏信息……感谢你的帮助和你的患者。我需要能够使用@openComment标记上的jquery单击功能。有人可以帮我吗此问题。我正在尝试打开一个id为的标记,该id是在构建表时动态生成的。id随每行的变化而变化。我正在尝试使用jquery显示对该特定行数据进行注释的正确id。我不能像Bill建议的那样使用该类作为标识符,因为它只打开第一次出现的id不确定我是否理解您的问题。您可以使用this.id获取在处理程序中单击的标记的id。查看更新的fiddle(),这有帮助吗?