jquery Dynamic Operation checkbox

Source: Internet
Author: User

  The origin of the problem: The HTML page uses a checkbox to authorize the new user and then submits it to the backend server to complete the authorization for the user. After the user authorization is completed, if the user's permissions change, the administrator needs to modify the permissions of multiple users or view a user's permissions, click on a different user needs to display different user's permission information in the checkbox, you need to change the checkbox dynamically.

  Exploration of solutions:

  First, the checkbox is traversed using jquery's attr, and all the checkboxes are set to False, not selected.

$ (' input[name= ' auth "]). each (function () {   $ (this). attr (" checked ", false);});

Next, through the Ajax incoming user name, get JSON, and get the user's own permissions module, through the checkbox value set whether the module selection

$.ajax ({type: "post", URL: "Demo", Daattype: "JSON", Data:{type: "GetRight", username:username},success:function (data) {var authobjs = eval ("(" +data+ ")");//Parse JSON data if (authobjs.status = = = False) {}else if (authobjs.status = = = True) {var Authapps = Authobjs.apps;$.each (authapps,function (I,authapp) {$ ("input:checkbox[value= '" +authApp+ "']"). attr (' Checked ', true);});}});

The final result is not very ideal, the first request is possible, if my permission only the first and second, then only the two tick, then the second time for another person, he originally has four permissions, then in addition to one and two other two is checked, the third time to change a person, he does not have any permissions, can also display are not checked The point is that if you switch the first or second person again, the display is not checked.

Using the browser's debug feature will find that the code executes correctly, but the checked property has not changed.

  solution : After a multi-party verification, attr and prop use is different, if the previous code of attr are modified to prop can be perfect to achieve the desired effect, that is, select a person can display the current rights of an individual.

  Here are the differences between attr and prop (I think the simpler explanation):

      • For the HTML element itself with the intrinsic properties, when processing, the use of the Prop method;
      • For HTML elements our own custom DOM properties, when processing, use the Attr method.

jquery Dynamic Operation checkbox

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.