If text in input box edited, then change the option from select next to it

Javascript & Ajax
#1

Hello ppl, I’m wondering how to do this individually(since i have others inputs all the same) for inputs and the select next to that input.
If the user, edits what he wrote earlier in the input box, then change the select next to it, change the option to a blank one. What he writes in input determinates options he gets. And depending on options he select, he gets a div shown or not.

What should I search? read for this, etc. Thanks

#2

How is this any different from the previous thread on this forum testing if an email domain has been typed in the text box?

1 Like
#3

As I do stuff I see the flaws of what I’m doing. I’ts similar but the problem now its backwards, you have the select with options already beacuse you already inputed something, so if you edit this something you can get email or name with options that don’t belong to you. But u just made me think maybe I can add some sort of validations if this happends then don’t allow submition?

I’ve tried removing values from select when this condition happends and it worked but then there where no values to select if after editing everything was ok.

Thanks again, your answers always make me think. I think I’m close to getting this the way I want.

#4

Its not clear, based on your description, what you want to do in every possible case.

For example - “What he writes in input determinates options he gets”. Does that mean that you are testing for specific values in the text field? If so, how many different choices (perhaps you should be using a select/option menu instead) and what are the different sets of options that are available for each text value?

Do you want a <div> for each select menu or just one total? When do you want the <div> to be shown and when do you want to hid it?

This will require an on change event for the text input, that will cause the first, blank option to become selected, on every change made to the text input. You could write more complicated code to ‘remember’ that a change occurred in the text input, perhaps just a counter, then only change the first, blank option to become selected on blur (loss of focus) of the text input, if the corresponding counter is not zero.

#5

Here’s the first step. The following will select the correct first, blank option when the text input is edited -

$(document).on('keyup change', '.char' , function() {
	$(this).closest('tr').find('.blank').prop('selected', true);
	checkExtras();
});

This requires that you add a char class to each text field. If your existing charset0, charset1, and charset2 are somehow related to this, when you find yourself creating a series of name-numbered things, it is a sign that you are doing something in the hardest way possible, and need to find a simpler, general-purpose way of doing the same thing.

1 Like
#6

Hi, thanks. And those area just for example and testing, I use that with the rows that are created so I don’t have that text in the page.
I just made it to not create a wall of code, I prefer if posible to post simple short things to not annoy ppl since I’m already making lots of questions.

Sponsor our Newsletter | Privacy Policy | Terms of Service