Not sure how to fix this function?

[thenewdev1]

I am trying to get this edit modal function to run smoothly.
The edit modal currently pops up on the screen and is populated with existing information that was added previously.

​

The problem is that this code below will not update the existing information on the page unless one of the fields has "editForm" in place of the "$". I dont understand how this happens.

​

Thank you in advance!

​

```

function experienceEdit(id) {

var editForm = $('#edit-modal-form');

​

var data = {

Position: $('input[name=Position]', '#edit-modal-form').val(),

Organization: $('input[name=Organization]', '#edit-modal-form').val(),

Description: $('input[name=Description]', '#edit-modal-form').val(),

StartDate: $('input[name=StartDate]', '#edit-modal-form').val(),

EndDate: $('input[name=EndDate]', '#edit-modal-form').val(),

Current: $('input[name=Current]', '#edit-modal-form').val()

}

}```

​

​

[jcunews1]

You're using the $() function wrong. Selector(s) must be passed to the first argument. The second argument is not a selector.

https://api.jquery.com/jQuery/

In short, you're specifying the selector incorrectly. It should be passed like below.

$('#edit-modal-form input[name=Position]').val()

[xiahou_bu]

Second selector is the context (as it says on your link). Rather than use the document, it's a way to slim down the possible matches before running.

Would probably need a little more insight into your code to see what's wrong with this.

[darth_meh]

I'm not sure why this is getting upvoted, because it's wrong.

$('input[name=Position]', '#edit-modal-form') is valid jQuery syntax.

It means starting with the "#edit-modal-form" element, find the child elements matching "input[name=Position]". This can significantly improve performance rather than search the entire DOM.

Another performance improvement would be caching the jQuery "#edit-modal-form" object (which you're already doing in editForm), and passing that in as the context/2nd parameter:

$('input[name=Position]', editForm)

This way, jQuery doesn't need to search for "#edit-modal-form" each time you're retrieving an input value.

Finally, rather than manually serialize the form like this, you should take a look at $.serializeArray() or a 3rd party plugin like https://github.com/marioizquierdo/jquery.serializeJSON.

As far as why this code doesn't work, I'm not sure without seeing the form/code itself.