I have two forms. Second one is just the same the first one, only difference is the names and IDs input fields and select boxes. For example in the first one has an input field like this:
<input type="text" name="fname" id="fname" placeholder="First name">
...and the second one has an input filed like this:
<input type="text" name="fname2" id="fname2" placeholder="First name">
Nothing else.
In the first one form it's working fine, but it isn't working in the second one. Just show a little box without any text.
No error messages, nothing in the console log.
Any idea?
try by initializing both control separate by id like below
$("#chosen1").chosen();
$("#chosen2").chosen();
bcoz i think your second form chosen control is not initialized.
Related
I have these inputs that take the values of a from a in my table when I click on a row. I want to make it so that the user cannot change the input themselves but want to bring values into them when a user clicks a table row. I will be passing these inputs in as a form. I know that when the input is like this:
that it will not be updated. Is there any other way to do it with an input. Is there a different type of tag I can use that can be passed through a form?
Rather than a read-only <input>, I'd go with a combination of a display element and a hidden form element. Something like:
<div id="my-display">This is a value</div>
<input id="my-input" name="my-input" type="hidden" />
And in the code update both:
$('#my-display').text(yourValue);
$('#my-input').val(yourValue);
You can style the display to the user however you like and don't have to worry about whether or not it "de-activates" the form input.
If you really want it to be an inactive input, you can use the same approach:
<input class="my-input" type="text" disabled />
<input class="my-input" type="hidden" name="my-input" />
Which may even save you a line of code here, since both can now use .val():
$('.my-input').val(yourValue);
Try disabled keyword as here
<div id="my-display">This is a value</div>
<input id="my-input" name="my-input" type="text" disabled/>
You can change the value by javascript as below:
document.querySelector('#my-input').value = 'the value you want to enter by javascript';
How do I bind an ng-model that is an array to a fixed number of textboxes?
Let's say I have three textboxes and they are all optional, how do you bind the ng-model to those textboxes?
<input type="text" name="optionalField[]">
<input type="text" name="optionalField[]">
<input type="text" name="optionalField[]">
You can type into any textbox (e.g. textboxes 2 and 3 only) and when you save it, it's just going to be optionalField: ['text2', 'text3'].
Where you place the text doesn't matter; what matters is the order of the textboxes. So when you show the view again, it's just going to be bound to the first and second textboxes. If you only typed on the textbox 3, it will be bound to textbox 1 and so on.
UPDATE:
Just used dfsq's answer and modified it to return a filtered array of values.
http://codepen.io/anon/pen/ozpxGq?editors=1011
In ng-repeat you can use $index
<input type="text" name="optionalField[]" ng-model="optionalField[$index]">
Like this:
<input type="text" name="optionalField[]" ng-model="optionalField[0]">
<input type="text" name="optionalField[]" ng-model="optionalField[1]">
<input type="text" name="optionalField[]" ng-model="optionalField[2]">
I am dealing with two versions of a page. The first one has a search input field as part of a form, and I can get that value no problem with
document.getElementsByClassName('search-input')[0].value
i.e. this will update as it's being typed. On the other version of the page (which I have no control over) the input field is not part of a form, and now the above code doesn't work (the class of the input field is still "search input").
Here is the html where it's working fine:
<form action="search-landing.aspx" method="GET">
<input class="search-input" autofocus="autofocus" placeholder="City, State or Zip" name="location" required="">
<button id="searchButton" tabindex="0" class="search-btn" type="submit">Search</button>
</form>
And here is the code where it's not
<div class="search-box">
<input type="text" class="search-input" placeholder="City, State or Zip">
</div>
Does anyone know why I'm having this issue? Is there a way around it (i.e. to grab a value from an input field that is NOT part of a form)?
Thanks
Rooster correctly pointed out that I may have more than 1 input field of class "search-input". There were two identical fields, one hidden so document.getElementsByClassName('search-input')[1].value was the answer in this case
I want to put a text next to an input box, after an successful if clause.
Just need to know how to show up such text.
Thanks
<input type="text" class="form-control" id="username" placeholder="Username" name="username" required autofocus/>
And my code snippet:
$("#username").append("<p>This username is not available</p>");
If your using jQuery, you can simply use:
$("#your-element-id").append("<strong>whatever text you need to add</strong>");
You will need to make sure that #your-element-id contains the input box. You may need to add the relavant CSS as well.
I've created a search page that can be toggled between french and english. So when the user searches a record and toggles to french it displays the same record they were viewing on the english page.
What I want to do is display the record name in the search box when the page is toggled.I assumed it was as simple as doing a $('#inputID').val(record); but it doesn't seem to be working. I've alerted the record name and it works fine, so I'm stumped. All the scripts are linked correctly as well so that's not the problem.
Autocomplete Box Code
<div id="ui-widgit">
<label for="searchParams">
<h1>Search All Programs (By Screen Number or By Error Code):</h1>
</label>
<input type="text" id="inputID" name="inputID" value="" class="ipt_Design" style="width:255px;" />
<input type="button" value="Search" name="searchBtn" class="btn_Design" onclick="showSearch(inputID.value)"/>
</div>
Try to change the value of inputID with this
$('#inputID').val(recordToggle);
also have tried this:
$('#inputID input').val(recordToggle);
It is hard to tell with your presented markup but I am assuming you are trying to change the value of $('#inputID') after the page refreshed. It is important where you put this code. If it is placed before <input type="text" id="inputID" name="inputID" value="" class="ipt_Design" style="width:255px;" /> you will not return anything with $('#inputID') so you will change the value of nothing to your text. It will give no error. To fix this you can use:
$( document ).ready(function(){
$('#inputID').val(recordToggle);
});
Be sure to read about jQuery's ready function because load may be the better choice.
If this doesn't fix your problem let me know. I will update my answer.