NetCore TagHelpers标签
TagHelpers 能够让服务端代码参与创建和渲染 HTML 元素,让整个View视图看起来只有Html代码,也让前台开发人员开发的页面直接被后台开发人员使用,而不需要重复的书写代码,这种设计将会成为主流,语法类似于KO和AngularJs,直接在Html元素上添加对应的标签即可,下面介绍几种主要的TagHelpers标签.
<opt:Typeselect x-for="TypeId" x-param="3" class="form-control" onchange="GetSelect()"></opt:Typeselect> <opt:Typeselect x-for="TypeId" x-param="2" x-first-value="0" x-first-text="请选择" class="form-control"></opt:Typeselect> <opt:Typeselect x-for="TypeId" x-param="2" x-first-value="" x-first-text="请选择" class="form-control" onchange="$(this).parents('form').submit();"></opt:Typeselect>
1 using System; 2 using System.Collections.Generic; 3 using Microsoft.AspNetCore.Mvc.Rendering; 4 using Microsoft.AspNetCore.Mvc.ViewFeatures; 5 using Microsoft.AspNetCore.Razor.TagHelpers; 6 7 namespace Data.TagHelpers 8 { 9 [HtmlTargetElement("opt:typeselect")] 10 public class TypeSelectTagHelper : ParamSelectableTagHelperBase 11 { 12 private readonly ITypeManager _iTypeManager; 13 14 public TypeSelectTagHelper(IHtmlGenerator generator, ITypeManager iTypeManager) : base(generator) 15 { 16 _iTypeManager= iTypeManager; 17 } 18 /// <summary> 19 /// 实现抽象类(绑定数据) 20 /// </summary> 21 protected override void Init(List<SelectListItem> items, TagHelperContext context, string Param) 22 { 23 TypeType enumType = (TypeType)Enum.Parse(Typeof(TypeType), Param);//字符串转为版本枚举类型 24 IEnumerable<Data.Types.Type> list = _ivManager.GetTypeByType(enumType); 25 foreach (var item in list) 26 { 27 items.Add(new SelectListItem { Text = item.TypeName, Value = item.Id.ToString() }); 28 } 29 } 30 } 31 }
$("#TypeId").change(function () { debugger var verid = $('#TypeId option:selected').val(); $.ajax({ url: "@Url.ActionUrl("GetTypeInfo")", data: { verid: verid}, dataType: 'JSON', Type: 'POST', success: function (d) { $("#name").val(d.data.name); $("#value option:contains('" + d.data.value + "')").attr("selected", true); }, error: function (resp) { if (resp.status === 401) { return; } else document.write(resp.responseText); } }); });