I have used modal in my html form and I am using angular $scope varible to bind textboxes using ng-model so if I am opening modal first and enter some value and just close the modal and reopen it then the values which was previously entered remains as it is.I want to make it blank on whatever times modal will open . I tried by putting autocomplete = "off" in input tag but didn't work for me.
To reset the input values use the following on modal close i.e
$('#my-modal').on('hidden.bs.modal', function () {
$(".modal-body input").val("");//this will reset all the input values
});
I hope this helps :)
Related
Some context:
AngularJS 1.4
Bootstrap 3.3.7
I'm using Bootstrap tabs navigation and panels inside a form.
Inside each panel I have an input that is required.
The default validation is not able to focus (change the active tab) and show the error message after the validation.
(console.log):
An invalid form control with name='' is not focusable.
A lot of "solutions" mention to remove the required attribute (from the hidden inputs) but that is not what I want because I need to have all inputs validated.
I tried to use ngModel validators but I'm not sure if it's a valid path for what I need.
What I'm trying to achieve is to be able to check the input's value and if invalid show it's tab, upon form submit.
Thank you.
[Solution found!]
Controller:
$scope.tabsValidation = form => {
let first = jQuery(`form[name="${form.$name}"] input.ng-invalid`).closest('.tab-pane');
let firstID = first.attr('id');
jQuery('.nav a[data-target="#' + firstID + '"]').tab('show');
};
View (form):
<button class="btn" type="submit" ng-click="tabsValidation(formName)">
Submit
</button>
From what I understand, the ng-click its executed before the actual form submit/validation.
How to make the html input field allow to be blank, when i click the submit button on the form view?
the idea is when I click the submit button, the input is a must to key in something else the behind code is unable to run, I am using the asp.net and the button is the asp button not html button
http://s15.postimg.org/wtl7xtuyx/myinputpic.png
I want to allow the new password can be blank
If clearing fields is what you want, use .reset() method.
document.getElementById("YourFormName").reset();
A working fiddle here:
https://jsfiddle.net/4fpk2z9o/
I may comprehend it wrongly as I do not really understand what do you want.
Update (To disable html 5 form validation) :
Add novalidate='' or <form action="yourform.asp" novalidate> to your form.
I'm new at Ionic and Angular. I try to create a post status like Facebook, my first task is when the user types any text and press the POST button I want the text in the input field to disappear, but it disappears in the first time when this view is a new load.
When I try to type any text in the input field and press the POST button, the text won't disappear but function in the controller was called. Past, I use label tag but when I press the POST button ng-click didn't work so I change label tag to div tag but it work at the first time as I say above and I include cache is false it didn't work too. Here is my Plunker, This issue is in Chat view.
The ng-model should be bound to an object and not to an variable.
The means the the declaration of the variable should be something like:
$scope.input = {
saySomething : 'Some question'
};
The input field should then be:
<input type="text" placeholder="Say Something" ng-model="input.saySomething"/>
Link to form
The form can be found at the link above.
Up until this morning the radio buttons and the form had been working as expected, however now users can't change their answer once they've picked from one of the two radio buttons even though they use the same input name. Using $("#volunteer-form input:radio[name='gender']:checked").val() I've found that the value is being correctly set and that the two buttons are still linked by a common name. Also, it appears possible to switch between the two using a bit of jQuery, like so:
$("#volunteer-form input[name=gender][value=male]").prop('checked', true);
Any ideas?
its because of your javascript block here:
$(document).ready(function() {
$('.inline').fancybox({
'maxWidth': 600
});
$('.form').click(function(event){
event.preventDefault();
});
});
when you are clicking on the radio button inside the form your preventDefault is stopping the change of radiobutton state ... or maybe you already knew that.
What is the intended purpose of including the preventDefault where you have it?
I have an HTML form where I have two fields: username and password.
Now, I want that "Username" and "Password" appear inside the fields to indicate the users what to put in. Currently I'm assigning these using the value= option, however if I submit the form, "Username" and "Password" get submitted too.
Is there a clean way how to make the text appear without including it in the submit if the submit is clicked.
Thanks!
Krt_Malta
Ok, this is basically how I do it. I place the labels inside the fields, then when the page loads, I store the labels in a hidden manner using .data(). When the form gets submitted, if it contains the same thing as in .data(), then I clear it (or you could disallow submission if you want the field to be filled)
$(document).ready(function(){
// this will make sure we always remember what the values were:
$("form.myform input[type='text']").each(function(){
// I like to add a class as well, so I can make the label text in a lighter color
if ($(this).val().length > 0) {
$(this).data('label', $(this).val()).addClass('label');
}
});
// this will clear the text when the input receives focus:
$("form.myform input[type='text']").focus(function(){
if ($(this).data('label') == $(this).val()) {
$(this).val('').removeClass('label');
}
});
// this will make sure the fields don't get submitted like that, but won't stop
// the form from being submitted....
$("form.myform").submit(function(){
$(this).find("input[type='text']").each(function(){
if ($(this).val() == $(this).data('label')) {
$(this).val('');
}
});
});
I haven't run this or tested in a browser, but in theory this should work (I've done this before)
Also, we're not filling the box with the label text again, once it's lost focus if the user didn't edit the text....
In HTML5, this feature is provided and is called a placeholder. Otherwise you typically use a Javascript library.
Just don't include it in your php/asp script with which you submit the form.
--edit--
Just re-read your question. I think you mean that people are just coming onto the page and clicking submit while the default values are in there, yeah?
If you use validation (javascript or php/asp) to disallow submission of 'username' and 'password' for these fields they won't be allowed to submit the form without changing the values within.
Is that the kind of thing you meant?