asked on

Convert Javascript to jQuery

I have the following function called from a selection in a grid:

I'd like to convert this to jquery. Is there a process or do people just know how this is done.

            function OnRowSelection() {
                var MasterTable = $find("<%=Grid.ClientID%>").get_masterTableView();
                var selectedItemsCount = MasterTable.get_selectedItems().length;
                    if (selectedItemsCount > 0) {
                        document.getElementById('btn1').disabled = false;
                        document.getElementById('btn2').disabled = false;
                        return false;
                    }
                    else
                        document.getElementById('btn1').disabled = true;
						document.getElementById('btn2').disabled = true;
						return false;
            }

Open in new window

Also more generally the button doesnt look disabled, although the on click event doent fire in its disabled state. How would I achieve the diabaled style when disabled?

ASKER CERTIFIED SOLUTION

Julian Hansen

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Andy Green

ASKER

LOL Actually there is not functional reason other than its the way things are done around here.

Julian Hansen

That's not a good reason at all. Sounds a lot like conformity for the sake of conformity.

There is nothing wrong with the function as you have it - jQuery will not add anything of value to it.

Ryan Chong

from jquery point of view, I can see the code below:

document.getElementById('btn1').disabled = false;

Open in new window

can be changed to jquery version like this:

$("#btn1").prop('disabled', false);

Open in new window

Julian Hansen

Just a note on the above.
Let's look at what is happening here
1. you invoke the jQuery function to wrap the element - somewhere in the guts of jQuery (after a bunch of other code runs) jQuery executes the document.querySelectorAll or similar
2. This creates and returns a jQuery object
3. You now invoke the method .prop() which is just going to get the first element in the jQuery array and then find the disabled property and set it. This is another way of doing it - illustrates what jQuery is doing

$('#bt1')[0].disabled = false;

Open in new window

All that overhead to do what could be done in one line.
Why use more CPU cyclesto achieve the same result with code that does not even save you lines
Compare the two approaches

$("#btn1").prop('disabled', false);
document.getElementById('btn1').disabled = false;

Open in new window

All you are doing is saving yourself 14 chars but running a significantly greater number of lines of code at the expense of greater CPU usage?

Where is the justification?

Be wary of tool fixation.

Andy Green

ASKER

Thanks Guys.

Totally take the point of why do it, and nice to see some pragmatism along my way of thinking. I've also shared with Ryan as he did answer the OP.

A

Julian Hansen

You are welcome.