-1
我有一个剃刀视图，其中有一个名为getDocumentDetails的函数。而我写了是继如何从Html Helper Class的脚本函数调用Java脚本函数？
public static MvcHtmlString CreateJQGrid<T>(this HtmlHelper helper, GridViewModel<T> model)
{
bool blnEditIcon = false;
bool blnEditRights = false;
var htmlBuilder = new StringBuilder();
// Place the Upload Button.
if ((!string.IsNullOrEmpty(model.UploadAction) || !string.IsNullOrEmpty(model.AddNewAction)) && model.UserAccessRights != Constants.UserType.View)
{
htmlBuilder.AppendFormat(@"<div align='right' class='icon-list'>");
if (!string.IsNullOrEmpty(model.UploadAction) && model.UserAccessRights != Constants.UserType.Checker && model.UploadRights == true)
{
htmlBuilder.AppendFormat(@"<a class=""upload"" href=""{0}"" id=""Upload"">Upload </a>", model.UploadAction);
}
// Place the Add New Button
if (!string.IsNullOrEmpty(model.AddNewAction) && model.UserAccessRights != Constants.UserType.Checker)
{
htmlBuilder.AppendFormat(@"<a class=""addnew"" href=""{0}"" id=""AddNew"">Add New</a>", model.AddNewAction);
}
htmlBuilder.AppendFormat(@" </div><br /><br />");
}
htmlBuilder.AppendFormat(@"<div align='right' class='icon-list'>");
if (!model.BulkApprovalRights)
model.multiselectCheckBox = false;
htmlBuilder.AppendFormat(@"</div>");
htmlBuilder.AppendFormat(@"<table id=""{0}"" class=""scroll"" cellpadding=""0"" cellspacing=""0""></table>", model.Id);
htmlBuilder.AppendFormat(@"<div id=""{0}Pager"" class=""scroll"" style=""text-align:center;""></div>", model.Id);
htmlBuilder.AppendFormat(@"<script type=""text/javascript"">");
htmlBuilder.AppendFormat(@" function EditingValidation(id) {{
var selr = $('#{0}').jqGrid('getGridParam','selrow');
var rowData = $('#{0}').getRowData(selr);
if(rowData.Edit=='')
{{
alert('You cannot edit the selected record.'); return [false, ''];
}}
return [true, ''];
Rejected
}}", model.Id);
//Md Aslam
htmlBuilder.AppendFormat(@" function addLinkk(cellvalue, options,
rowObject) {{
alert('AddLinkk');
return '<a href=""#"" onclick=GridCellClick(""'+cellvalue+'"")><font color=""blue""><u>'+cellvalue+'</u></font></a>';
}}", model.Id);
htmlBuilder.AppendFormat(@" function GridCellClick(cellValue) {{
getDocumentDetails(); }}", model.Id);
htmlBuilder.AppendFormat(@"function highlight (cellValue, options,
rowObject) {{
if(cellValue=='Approved')
return '<span class=""label-
successforecolor"">'+cellValue+'</span>';
else if(cellValue=='Rejected')
return '<span class=""label-
dangerforecolor"">'+cellValue+'</span>';
else if(cellValue=='Pending')
return '<span class=""label-infoforecolor"">'+cellValue+'</span>';
else
return cellValue;
}}");
htmlBuilder.AppendFormat(@"$(function()");
htmlBuilder.AppendFormat(@"{{");
htmlBuilder.AppendFormat(@"var lastsel;");
htmlBuilder.AppendFormat(@"$('#{0}').jqGrid({{", model.Id);
htmlBuilder.AppendFormat(@"url: '{0}',", WebExtensions.GetUrlContent() + model.Url);
//htmlBuilder.AppendFormat(@"editurl: '/InwardOutward/Edit',");
if (!string.IsNullOrEmpty(model.EditUrl))
htmlBuilder.AppendFormat(@"editurl: '{0}',", WebExtensions.GetUrlContent() + model.EditUrl);
htmlBuilder.AppendFormat(@"datatype: 'json',");
htmlBuilder.AppendFormat(@"mtype: 'POST',height:280,");
//Create Columns Names
htmlBuilder.AppendFormat(@"colNames: [");
foreach (var action in model.Actions)
{
htmlBuilder.AppendFormat(@"'{0}',", action.Name.ToString());
}
foreach (var column in model.Columns)
{
htmlBuilder.AppendFormat(@"'{0}',", column.Name.ToString());
}
htmlBuilder.AppendFormat(@"],");
//Create Columns
htmlBuilder.AppendFormat(@"colModel: [");
foreach (var column in model.Columns.OrderBy(x => x.ActionOrder))
{
if (column.Name.ToUpper() == "REMARKS")
{
htmlBuilder.AppendFormat(@"{{name: '{0}',
index: '{1}',
align: '{2}',
search: {3},
sortable: {4},
width: {5},
hidden: {6},
sorttype: '{7}',
sortable: true,
searchoptions: {{sopt:[{8}]}},
editable: {9},
hidedlg: {10},
edittype:'{11}',
editrules: {{custom: true, custom_func: EditingValidation}},
classes: 'textInDiv',
formatter: function (v) {{return '<div>' + $.jgrid.htmlEncode(v) + '</div>';}}
", column.Index.ToString()
, column.Index
, column.Align == null ? "left" : column.Align.ToLower()
, column.IsSearch.ToString().ToLower()
, column.IsSortable.ToString().ToLower()
, column.Width > 0 ? column.Width : 100
, column.IsHidden.ToString().ToLower()
, column.SortType == null ? "string" : column.SortType.ToString().ToLower()
, column.SearchOptions == null ? "'eq','bw','bn','cn','nc','ew','en'" : column.SearchOptions.ToString().ToLower()
, column.IsEditable.ToString().ToLower()
, column.IsEditHidden.ToString().ToLower()
, column.IsEditTypeSelect == true ? "select" : "text"
);
}
else
{
htmlBuilder.AppendFormat(@"{{name: '{0}',
index: '{1}',
align: '{2}',
search: {3},
sortable: {4},
width: {5},
hidden: {6},
sorttype: '{7}',
sortable: true,
searchoptions: {{sopt:[{8}]}},
editable: {9},
hidedlg: {10},
edittype:'{11}',
editrules: {{custom: true,
custom_func: EditingValidation}}"
, column.Index.ToString()
, column.Index
, column.Align == null ? "left" : column.Align.ToLower()
, column.IsSearch.ToString().ToLower()
, column.IsSortable.ToString().ToLower()
, column.Width > 0 ? column.Width : 100
, column.IsHidden.ToString().ToLower()
, column.SortType == null ? "string" :
column.SortType.ToString().ToLower()
, column.SearchOptions == null ?
"'eq','bw','bn','cn','nc','ew','en'" :
column.SearchOptions.ToString().ToLower()
, column.IsEditable.ToString().ToLower()
, column.IsEditHidden.ToString().ToLower()
, column.IsEditTypeSelect == true ? "select" : "text"
);
}
if (column.Index == "Status")
htmlBuilder.AppendFormat(@",formatter:highlight
}},");
else
htmlBuilder.AppendFormat(@"}},");
if (column.IsEditable && !blnEditRights &&
!string.IsNullOrEmpty(model.EditUrl))
blnEditIcon = true;
}
htmlBuilder.AppendFormat(@"],");
htmlBuilder.AppendFormat(@"loadtext: 'Loading {0}',",
model.Caption);
htmlBuilder.AppendFormat(@"pager: jQuery('#{0}Pager'),", model.Id);
htmlBuilder.AppendFormat(@" rowNum: 20,
rowList: [10, 20, 30, 40, 50, 60, 70,
80, 90, 100, 200,500,1000,100000000],
loadonce: true,
ignoreCase: true,
viewrecords: true,
");
//htmlBuilder.AppendFormat(@"multiSort: true,");
htmlBuilder.AppendFormat(@"caption: '{0}',", model.Caption);
htmlBuilder.AppendFormat(@"pagepos: 'left',
forceFit: true,
autowidth: true,
shrinkToFit: false,");
htmlBuilder.AppendFormat(@"}});");
htmlBuilder.AppendLine(@"");
htmlBuilder.AppendLine(@"");
htmlBuilder.AppendFormat(@"$('#{0}').jqGrid(", model.Id);
htmlBuilder.AppendFormat(@"'navGrid', '#{0}Pager',{{ search: true,
add: false, edit: true, del: false, refresh: false, searchtext:
'Search',edittext: 'Edit',position: 'left'
,", model.Id);
if (blnEditIcon)
{
htmlBuilder.AppendFormat(@"edit: true, edittext: 'Edit'");
//afterSubmit:function(response, postdata){{ alert('Coming');
var json = response.responseText;var result = JSON.parse(json);return
[result.status,result.message,null]; }}
}
else
{
htmlBuilder.AppendFormat(@"edit: false,");
}
htmlBuilder.AppendFormat(@"
}},");
htmlBuilder.AppendFormat(@" {{
afterSubmit:function(response, postdata){{
if(response.status == 200)
{{
$('.topinfo').html('<div
style=\'color:red\'>'+response.responseText+'</div>');
var tinfoel = $('.tinfo').show();
//tinfoel.delay(1500).fadeOut();
return [true,''];
}} else {{
return [false,'error message'];
}}
}},
onclickPgButtons:function(){{
$('.topinfo').html('<div style=\'color:green\'> </div>');
}}
}},
{{}},
{{}},
{{multipleSearch:true,
multipleGroup:true, showQuery: true,closeAfterSearch: true,searchOnEnter:
true}}");
htmlBuilder.AppendFormat(@");");
/* Add this line to include a separator between buttons */
SeparatorBetweenButtons(model.Id, htmlBuilder);
//Enable the Refresh
htmlBuilder.AppendLine(@"");
htmlBuilder.AppendLine(@"");
htmlBuilder.AppendFormat(@"$('#{0}').jqGrid('navButtonAdd', '#{1}Pager', {{", model.Id, model.Id);
htmlBuilder.AppendFormat(@"caption: 'Refresh',");
htmlBuilder.AppendFormat(@"buttonicon: 'ui-icon-refresh',
title: 'Refresh',");
htmlBuilder.AppendFormat(@"onClickButton: function() {{");
htmlBuilder.AppendFormat(@"$('#{0}').setGridParam({{ datatype:
'json' }});", model.Id);
htmlBuilder.AppendFormat(@"$('#{0}')[0].clearToolbar();", model.Id);
htmlBuilder.AppendFormat(@"$('#{0}').trigger('reloadGrid');",
model.Id);
htmlBuilder.AppendFormat(@"}}");
htmlBuilder.AppendFormat(@"}});");
SeparatorBetweenButtons(model.Id, htmlBuilder);
htmlBuilder.AppendLine(@"");
htmlBuilder.AppendLine(@"");
htmlBuilder.AppendFormat(@"$('#{0}').jqGrid('filterToolbar', {{
searchOperators: true, defaultSearch:'cn' }});", model.Id);
htmlBuilder.AppendFormat(@" }}); ");
htmlBuilder.AppendFormat(@"</script>");
return MvcHtmlString.Create(htmlBuilder.ToString());
}
其中编辑列包含jqGrid的格式属性的HTML辅助类，并呼吁addLinkk功能。在那个addLinkk函数中，称为getDocumentDetails函数，它在实际的剃刀视图文件中是razor文件。在调用getDocumentDetails时，它显示“getDocumentDetails未定义”。
这里的问题是我不能从html助手类调用函数。我不知道该怎么做。请任何人帮助我。
我的剃须刀视图如下。
@using Intranet.Common;
@using CSR.UI.Web.Helpers;
@using CSR.Model;
@using Intranet.Utilities;
@model CorpGroupModel
@{
ViewBag.Title = "AddEditCorpGroup";
//Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
Manage Corporate Group </h3>
</div>
<div class="panel-body">
<br />
@Html.CreateJQGrid(Model.GridData)
</div>
</div>
<br/>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
Add/Edit Corporate Group</h3>
</div>
<div class="panel-body">
<div class="icon-list">
@Html.ActionLink("Back to List", "ManageCorpGroup", null, new { @id
= "BackToList", @class = "backbtn" })
</div>
</br>
@using (Html.BeginForm(Constants.Action.AddEditCorpGroup,
Constants.Controller.CorpGroup, FormMethod.Post, new { @role = "form" }))
{
@Html.AntiForgeryToken()
@Html.HiddenFor(m => m.IsAdd)
@Html.HiddenFor(m => m.Id)
@Html.HiddenFor(m => m.CompanyId);
@Html.HiddenFor(m => m.Status);
@Html.HiddenFor(m => m.CreateUser);
@Html.HiddenFor(m => m.CreateDate);
@Html.HiddenFor(m => m.IsUserLoggedIn);
@Html.HiddenFor(m => m.LoggedInUserSeq);
@Html.HiddenFor(m => m.UserAccessRights);
@Html.HiddenFor(m => m.IsMakerRemarks)
@Html.HiddenFor(m => m.IsCheckerRemarks)
<div class="row">
<div class="col-md-4">
<label for="" class="control-label">
Corporate Group Name </label><br />
@Html.TextBoxFor(model => model.CorpGroupName, new { @class
= "form-control mand", @onkeypress = "return OnlyAlphaNumeric(this);",
@onkeyup = "return CPOnlyAlphaNumeric(this);" }).DisableIf(() =>
Model.IsReadOnly == true)
</div>
<div class="col-md-4">
<label for="" class="control-label">
Corporate Group Name </label><br />
@Html.TextBoxFor(model => model.ManagingDirector, new {
@class = "form-control mand", @onkeypress = "return
OnlyAlphaNumeric(this);", @onkeyup = "return CPOnlyAlphaNumeric(this);"
}).DisableIf(() => Model.IsReadOnly == true)
</div>
<div class="col-md-4">
<label for="" class="control-label">
Address1 </label><br />
@Html.TextBoxFor(model => model.Address1, new { @class =
"form-control mand", @onkeypress = "return OnlyAlphaNumeric(this);",
@onkeyup = "return CPOnlyAlphaNumeric(this);" }).DisableIf(() =>
Model.IsReadOnly == true)
</div>
<div class="col-md-4">
<label for="" class="control-label">
Address2 </label><br />
@Html.TextBoxFor(model => model.Address2, new { @class =
"form-control", @onkeypress = "return OnlyAlphaNumeric(this);", @onkeyup =
"return CPOnlyAlphaNumeric(this);" }).DisableIf(() => Model.IsReadOnly ==
true)
</div>
<div class="col-md-4">
<label for="" class="control-label">
Address3 </label><br />
@Html.TextBoxFor(model => model.Address3, new { @class =
"form-control", @onkeypress = "return OnlyAlphaNumeric(this);", @onkeyup =
"return CPOnlyAlphaNumeric(this);" }).DisableIf(() => Model.IsReadOnly ==
true)
</div>
<div class="col-md-4">
<label for="" class="control-label">
Address4 </label><br />
@Html.TextBoxFor(model => model.Address4, new { @class =
"form-control", @onkeypress = "return OnlyAlphaNumeric(this);", @onkeyup =
"return CPOnlyAlphaNumeric(this);" }).DisableIf(() => Model.IsReadOnly ==
true)
</div>
</div>
}
</div>
</div>
<script type="text/javascript">
// Start of Hide Reset button in edit mode
var model = @Html.Raw(Json.Encode(Model))
$(document).ready(function() {
function getDocumentDetails()
{
alert("2");
}
});
</script>
哇，这种方法正在让我的眼睛流血大声笑。在我看来，你应该更好地利用视图和视图模型，而不是像这样构建HTML代码。尽管如此，这还有点不同。 – Luke
运行代码时，呈现的代码输出是什么？它创建的JavaScript代码实际上是否有效？ – Luke
你的目标是什么？你想在js中获取模型值吗？ –