Build a high-performance, lightweight webform framework that subverts your imagination-js directly calls the background encapsulation (the third day), webform-js

Source: Internet
Author: User

Build a high-performance, lightweight webform framework that subverts your imagination-js directly calls the background encapsulation (the third day), webform-js

If you didn't read what I wrote the next day, I don't think you can understand it !!!!

Well, we don't have to talk about it. How can we make our code awesome? How can we encapsulate our code? It is impossible for us to write that way on every page. Let's encapsulate our code step by step to make it more awesome and more maintainability !!!!!

First, let's analyze the code I wrote yesterday:

Step 1: Write two hidden controls on the interface to store method names and parameters. (You cannot write them on every page !!! Of course not. What should I do)

In this way, jquery judges whether the control exists and writes the control if it does not exist after loading the page every time. No operation is performed if the control exists !!

$ (Function () {if ($ ("# hid_fangfa "). length <1) // determine whether the hidden control of the method name exists. If it does not exist, write the hidden control {$ ("# form1 "). children (). eq (0 ). after ('<input type = "hidden" name = "hid_fangfa" id = "hid_fangfa"/>');} if ($ ("# hid_canshu "). length <1) {// determine whether the hidden control of the parameter exists. If it does not exist, write it to the hidden control.
$("#form1").children().eq(0).after('<input type="hidden" name="hid_canshu" id="hid_canshu" />'); } });

Step 2: Write a method in js. You can use only one parameter (method name) to dynamically splice multiple parameters and splice dynamic parameters into a hidden control, then execute the form submission (it seems that js is not well learned, so it is difficult to implement it !!!!!)

Here we will use the dynamic parameters of arguments !!! (All parameters except method names need to be spliced. We use '|' to splice them)

Function gohoutai (fangfa) {var canshu = ''; for (var I = 0; I <arguments. length; I ++) {// obtain all parameters. Except the method name, all parameters need to be spliced if (typeof (arguments [I]) = 'object ') // The concatenation object only supports string and number {continue;} if (I! = 0 & I = 1) {canshu = canshu + arguments [I]. toString ();} if (I> 1) {canshu = canshu + "|" + arguments [I]. toString () ;}$ ("# hid_fangfa "). val (fangfa); // store the method name in the hidden control $ ("# hid_canshu "). val (canshu); // Save the spliced parameters in the hidden control.
$ ("# Form1"). attr ("target", "_ self"); // indicates the default page submitted by form1.
$ ("# Form1"). submit (); // submit the form
}

Step 3: different methods are executed in the background by hiding the method names in the control (do you have to judge the value of the hidden control cyclically before executing different methods? Do you want to use legend reflection !!!!)

Dear friends, you are right. Only reflection can achieve dynamic calling of different methods in the background at the front end.

The background code needs to be able to dynamically call the foreground method through js, so it must inherit a class. This class is called the parent class. Here we have created a class named Base, you also need to Inherit System. web. UI. page,

First, we get the value of the hidden control through the Request method, then find the corresponding method of the page through the method name, number of parameters, and then execute this method!

 

Using System;
Using System. Collections. Generic;
Using System. Linq;
Using System. Reflection; // Reflection needs to be referenced
Using System. Web;
Using System. Web. UI;
Using System. Web. UI. HtmlControls;
Using System. Web. UI. WebControls;

Public class Base: System. web. UI. page {protected override void OnInit (EventArgs e) {if (Page. isPostBack) {string fangfa = this. request ["hid_fangfa"] = null? "": This. Request ["hid_fangfa"]. ToString (); // obtain the method name string canshu = this. Request ["hid_canshu"] = null? "": This. Request ["hid_canshu"]. ToString (); // get the Parameter
MethodInfo method = null; MethodInfo [] methods = this. getType (). getMethods (); // obtain all methods in this class for (int I = 0; I <methods. length; I ++) // traverse all methods, find the method with the same name and the same number of parameters {if (methods [I]. name = fangfa & methods [I]. getParameters (). length = canshu. split ('| '). length) {method = methods [I]; break ;}} if (method! = Null) // determine whether to find the method {string [] strs = canshu. split ('|'); // obtain the array method after parameter segmentation. invoke (this, strs); // execution method }}}}

Step 4: first introduce the js we just wrote. At the same time, the backend needs public partial class test1: Base to inherit the public class we wrote.

Let's call the method dynamically at the front-end !!

Foreground: <input type = "button" value = "2 parameters" onclick = "gohoutai ('gogogo', 'I am a good guy', '123');"/>

<Input type = "button" value = "1 parameter" onclick = "gohoutai ('gogogo', '123');"/>

Background:

Public void gogo (string s, string dd)
{
S = "2222 ";
}

Public void gogo (string ss)
{
Ss = "2222 ";
}

Then we break into the breakpoint, hoping to hit it !!!!!! (Break point successfully)

 

 

 

At this point, the encapsulation of our front-end call backend is over. I think you have never seen such an awesome encapsulation !! The world of code is crazy !!!!!!!!!!!!!!!!!

!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

 

 

After reading so many articles I have written, you find that there is no such thing. It seems that the interface is refreshed. What should I do if I don't want to refresh and submit it to the background? In addition, I want to return parameters after the execution is completed like ajax, so that the execution can continue at the front end! I think we are revolutionizing webform !!!!!

 

 

 

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.