Javascript 剑道内联模板中的jQuery
可以让jQuery在内联模板中运行吗 以下是我想要实现的目标。我有一个内联模板,其中包含一个表单,用户填写后提交回我的控制器。我在表格上有一组单选按钮。如果他们单击最后一个单选按钮,我需要显示我的文本区域,并且需要提交表单 以下是调用使用模板的窗口的代码:Javascript 剑道内联模板中的jQuery,javascript,jquery,kendo-ui,kendo-asp.net-mvc,Javascript,Jquery,Kendo Ui,Kendo Asp.net Mvc,可以让jQuery在内联模板中运行吗 以下是我想要实现的目标。我有一个内联模板,其中包含一个表单,用户填写后提交回我的控制器。我在表格上有一组单选按钮。如果他们单击最后一个单选按钮,我需要显示我的文本区域,并且需要提交表单 以下是调用使用模板的窗口的代码: function onRejectClick(e) { e.preventDefault(); var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
function onRejectClick(e) {
e.preventDefault();
var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
var wnd = $("#Reject").data("kendoWindow");
wnd.content(rejectTemplate(dataItem));
wnd.center().open();
}
<script type="text/x-kendo-template" id="rejectTemplate">
<div id="reject-container">
@using (Html.BeginForm("RejectConcern", "Filter", FormMethod.Post, new { @id = "rejectConcern", @style = "width:100%", @class = "k-content" }))
{
@Html.AntiForgeryToken()
<input type="hidden" id="id" name="id" value="#= data.id #" />
<table>
<tr>
<td valign="top">
<label>Reason</label>
</td>
<td>
<label>
@Html.RadioButton("reasonForRejection", "NotQuestion", false, new { @id = "reasonForRejection" })Concern is not a question and will not be answered
</label>
<label>
@Html.RadioButton("reasonForRejection", "Inappropriate", false, new { @id = "reasonForRejection" })Concern contains inappropriate language and will not be answered
</label>
<label>
@Html.RadioButton("reasonForRejection", "Irrelevant", false, new { @id = "reasonForRejection" })Concern is not relevant to our business/operation and will not be answered
</label>
<label>
@Html.RadioButton("reasonForRejection", "Personal", false, new { @id = "reasonForRejection" })Concern is about an individual, a specific group, or area and will not be answered
</label>
<label>
@Html.RadioButton("reasonForRejection", "Other", false, new { @id = "reasonForRejection" })Other
</label>
</td>
</tr>
<tr>
<td> </td>
<td>
@Html.TextArea("answer",
new
{
@id = "answer",
@name = "answer",
@class = "k-textbox",
@placeholder = "Enter the reason for rejection here.",
@validationmessage = "The reason for rejection is required.",
@style = "width: 600px; min-width:600px; max-width:69%; height:200px",
@maxlength = "1000"
}
)
</td>
</tr>
<tr>
<td> </td>
<td>
<div class="actions">
<button type="submit" id="rejectConcernButton" class="k-button">Submit</button>
</div>
</td>
</tr>
</table>
}
</div>
</script>
这是我的模板:
function onRejectClick(e) {
e.preventDefault();
var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
var wnd = $("#Reject").data("kendoWindow");
wnd.content(rejectTemplate(dataItem));
wnd.center().open();
}
<script type="text/x-kendo-template" id="rejectTemplate">
<div id="reject-container">
@using (Html.BeginForm("RejectConcern", "Filter", FormMethod.Post, new { @id = "rejectConcern", @style = "width:100%", @class = "k-content" }))
{
@Html.AntiForgeryToken()
<input type="hidden" id="id" name="id" value="#= data.id #" />
<table>
<tr>
<td valign="top">
<label>Reason</label>
</td>
<td>
<label>
@Html.RadioButton("reasonForRejection", "NotQuestion", false, new { @id = "reasonForRejection" })Concern is not a question and will not be answered
</label>
<label>
@Html.RadioButton("reasonForRejection", "Inappropriate", false, new { @id = "reasonForRejection" })Concern contains inappropriate language and will not be answered
</label>
<label>
@Html.RadioButton("reasonForRejection", "Irrelevant", false, new { @id = "reasonForRejection" })Concern is not relevant to our business/operation and will not be answered
</label>
<label>
@Html.RadioButton("reasonForRejection", "Personal", false, new { @id = "reasonForRejection" })Concern is about an individual, a specific group, or area and will not be answered
</label>
<label>
@Html.RadioButton("reasonForRejection", "Other", false, new { @id = "reasonForRejection" })Other
</label>
</td>
</tr>
<tr>
<td> </td>
<td>
@Html.TextArea("answer",
new
{
@id = "answer",
@name = "answer",
@class = "k-textbox",
@placeholder = "Enter the reason for rejection here.",
@validationmessage = "The reason for rejection is required.",
@style = "width: 600px; min-width:600px; max-width:69%; height:200px",
@maxlength = "1000"
}
)
</td>
</tr>
<tr>
<td> </td>
<td>
<div class="actions">
<button type="submit" id="rejectConcernButton" class="k-button">Submit</button>
</div>
</td>
</tr>
</table>
}
</div>
</script>
@使用(Html.BeginForm(“RejectConcern”、“Filter”、FormMethod.Post、新的{@id=“RejectConcern”、@style=“width:100%”、@class=“k-content”}))
{
@Html.AntiForgeryToken()
理由
@RadioButton(“reasonForRejection”、“NotQuestion”、false、new{@id=“reasonForRejection”})问题不是问题,也不会得到回答
@RadioButton(“reasonForRejection”、“不适当”、false、new{@id=“reasonForRejection”})问题包含不适当的语言,不会得到回答
@RadioButton(“reasonForRejection”、“Unrelated”、false、new{@id=“reasonForRejection”})问题与我们的业务/运营无关,不会得到回答
@RadioButton(“reasonForRejection”,“Personal”,false,new{@id=“reasonForRejection”})关注的是个人、特定群体或区域,不会得到回答
@RadioButton(“reasonForRejection”、“Other”、false、new{@id=“reasonForRejection”})Other
@text区域(“回答”,
新的
{
@id=“答案”,
@name=“answer”,
@class=“k-textbox”,
@占位符=“在此处输入拒绝的原因。”,
@validationmessage=“需要拒绝的原因。”,
@style=“宽度:600px;最小宽度:600px;最大宽度:69%;高度:200px”,
@maxlength=“1000”
}
)
提交
}
如何使用jQuery显示/隐藏应答文本区域字段,并根据是否选中最后一个单选按钮使其成为必需字段?如果jQuery不可能,那么可以通过常规JavaScript完成吗?如果可以在JavaScript中完成,那么在这种情况下可以在jQuery中完成。我的意思是,如果可以使用javascript代码,也可以使用jQuery代码。我建议您在小部件的主元素中设置一个事件。每个小部件都有一个名为
element
的属性,它为您提供小部件的主html元素。因此,如果您在小部件内的所有广播框中设置事件,您将能够操纵模板生成的内容,例如:
$($("#listView").data("kendoListView").element).on('change', 'input[type="radio"]', function() { });
我不确定您使用的是什么小部件,但我在本演示中使用了ListView。如果可以在javascript中完成,那么在本例中可以在jQuery中完成。我的意思是,如果可以使用javascript代码,也可以使用jQuery代码。我建议您在小部件的主元素中设置一个事件。每个小部件都有一个名为
element
的属性,它为您提供小部件的主html元素。因此,如果您在小部件内的所有广播框中设置事件,您将能够操纵模板生成的内容,例如:
$($("#listView").data("kendoListView").element).on('change', 'input[type="radio"]', function() { });
我不确定您使用的是什么小部件,但我在这个演示中使用了ListView