Bootstrap encapsulated bullet layer

There are many plug-ins for Bootstrap's bullet layer. Today, it mainly uses its own functions, which are implemented through the mode window provided by bootstrap. The editor mainly encapsulates the usage method. Developers can dynamically pass in the HTML content of the bullet layer by themselves, and can control the display and hiding of buttons. Users generate the bullet layer through the MVC extension method, and then use the A tag to call it.

It's very easy to use

 @Html.GenerateDialog("test",true, @<div><form action="/home/index">hello world!</form></div>)<a data-toggle='modal' data-target='#LindModal'>Test the bullet layer</a>

The above code is divided into two pieces. The first one is MVC extension method, which is mainly used to output the code segment of the bullet layer on the page, and the second segment is the call of the A tag, which is mainly used to bind the bullet layer control above.

Let’s take a look at the extension method of the bullet layer. It uses the Func<string, HelperResult> delegation to receive HTML code snippets from the front desk. This is a blessing for developers. You don’t have to worry about how to splice HTML code, but just copy the code given to us by the front desk.

Elastomer layer method

 #region Bootstrap bullet layer/// <summary>/// bootstrap style bullet layer/// </summary>/// <param name="htmlHelper"></param>/// <param name="isBtn"></param>/// <param name="result"></param>/// <returns></returns>public static MvcHtmlString GenerateDialog(this HtmlHelper htmlHelper, bool isBtn, Func<string, HelperResult> result){return GenerateDialog(htmlHelper, "Details", isBtn, result);}/// <summary>/// bootstrap-style bullet layer/// </summary>/// <param name="htmlHelper"></param>/// <param name="title"></param>/// <param name="isBtn"></param>/// <param name="result"></param>/// <param name="result"></param>/// <returns></returns>public static MvcHtmlString GenerateDialog(this HtmlHelper htmlHelper, string title, bool isBtn, Func<string, HelperResult> result){string temple = @"<div class='modal fade' id='LindModal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'><div class='modal-dialog'><div class='modal-content'><div class='modal-header'><button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button><h4 class='modal-title' id='myModalLabel'>"+title+@"</h4></div><div class='modal-body' id='dialogContent'>" + result.Invoke(null) + "</div>";if (isBtn){temple +=@"<div class='modal-footer'><button type='button' class='btn btn-warning'data-dismiss='modal'>Close</button><button type='button' class='btn btn-primary' id='subBtn'>Submit</button></div>";}templete +=@"</div></div></div><script>$('#subBtn').click(function(){$('#dialogContent form').submit();});</script>";return MvcHtmlString.Create(templete);}#endregion

And the effect of operation is what we can imagine

The above is the encapsulated bullet layer of Bootstrap introduced to you by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. Thank you very much for your support to Wulin.com website!