I would like to make certain fields in the form to read only while other editable. I read this in HTML (Read only)
<form action="demo_form.asp">
Country: <input type="text" name="country" value="Norway" readonly="readonly" /><br />
<input type="submit" value="Submit" />
</form>
This example specifically states the fields which will be editable. But i am using Django Forms. I am not able to do this specifically because the field is derived from models.py.
What options do i have in making the fields read only? Need some suggestions and guidance...
When creating the form add an extra param to add the readonly attribute, for your field:
name = forms.CharField(widget=forms.TextInput(attrs={'readonly':'readonly'}))
You can use jQuery to add the property?
$('.inputClass').prop("readonly", true);
Related
I have in a form an input field, its type is url.
I want the field will accepted when I write anything in it.
(I don't want to change the input type).
(Without using Javascript please).
Do you know how can I make it ? Thank you
It is not possible without changing the input type but you can use the pattern to perform custom validation like in the example below
<html>
<form action="/">
<input id="url" name="url" type="text" pattern="[A-Z]{3}" title="Custom Validation/">
<button type="submit" >Submit</buton>
</form>
</html>
Hi I have a simple question that I haven't been able to find the answer for. I have two fields in my CRM that I want to map to the user input in a form. How can I send it to both fields? Currently the below code only sends it to "dayphone".
<fieldset><input name="dayphone" name="eveningphone" type="number"
autofocus="" placeholder="phone" /></fieldset>
You can use Jquery to add the value of the input field to a hidden input field.
Jquery
$('#phoneOne').change(function() {
$('#phoneTwo').val($(this).val());
});
Hidden input field
<fieldset>
<input name="dayphone" id="phoneOne" type="number" autofocus="" placeholder="phone" />
<input name="eveningphone" id="phoneTwo" type="hidden" />
</fieldset>
This way it will only display one input field but two fields will be posted when you submit the form.
Also I know your tags specified HTML, but you simply can't do this in HTML alone you need some sort of scripting language (I chose Jquery)
I've got really simple question - is there any way to disable HTML5 validation only for some chosen inputs (instead of setting "novalidate" for whole form)?
I mean something like <input type='number' requirednovalidate>. But this doesn't work.
You may ask why I need type="number" or "required" then? Well, I need it there because my framework uses it for its own validation.
EDIT
It is about one special input - birth number. I need it to be of type number (because of mobile devices) but its value is mostly used with "/" (e.g. 860518/8757) which is not valid character for type number. So I need user to fill it without slash (8605188757). The problem is when there is invalid value filled in html5 input (e.g. "fsda" in number type), it seems like it is empty, with no value.
So when user fill the value in wrong format (860518/8757), html validation is disabled so the JS validation runs, it is validated like empty field. So the error message is like "Please fill the field birth number" (which is really confusing) instead somthing like "Sorry, wrong format".
My solution was to enable html5 validation for this field (so the default browser message is displayed when there is wrong format filled) but disable it for other fields so that they would be validated only with my JS validation.
You cannot disable HTML5 validation for a chosen input(s).
If you want to remove validation on the entire form you can use formnovalidate in your input element.
For example,
<input type="submit" value="Save" class="button primary large" formnovalidate/>
Note you can use formnovalidate with <input type=submit>, <inut type=image> or <button> -source
For more info go here or here.
novalidate attribute is only for form tag, it can't be applied on form controls.
You can remove the required attribute in js, after your framework validates:
$('[Selector]').removeAttr('required');
Now the selected field will not be validated.
Inputs will be validate when:
have attr required or prop required=true
aren't empty; don't have to have attr required or prop required=true
and have no attr disabled or prop disabled=true
If you want to validate data in a specific way, use pattern attr.
JSFiddle
(function() {
document.querySelector('form').addEventListener('submit', function(event) {
event.preventDefault();
});
})();
<form>
1. <input type='text'><br>
2. <input type='text' required><br>
3. <input type='text' required disabled><br>
4. <input type='text' value="" pattern="\d*"><br>
5. <input type='text' value="" pattern="\d*" required><br>
6. <input type='text' value="" pattern="\d+"><br>
7. <input type='text' value="" pattern="\d+" required><br>
8. <input type='text' value="test" pattern="\d+" required disabled><br>
<button>check field validity</button>
</form>
I was hoping someone could help me with submitting the answers to an HTML form as parameters of a link. So for example, lets say the form looked like this:
Name: _______
Question: ______
Then, when the user types their answers, and hits submit, I want the answers to be placed as parameters of the link so that if the user types:
Name: Joe Smith
Question: How do I win?
When the user then presses submit, a link that looks like the following would be submitted:
https://myurl.com/Submit.asp?Name=Joe%20Smith&Question=How%20do%20I%20win?
You need to use ,refer link
method="GET"
more genrilize,
<form action="url" method="GET">
<input type="text" name="Name" value="" />
<input type="text" name="Question" value="" />
<input type="submit" />
</form>
So when you submitthe form it will automatically build the querystring and append it to url.
go through submitting form here
Use Method type GET for your form
Firstly, it was hard to include the question inside the title, so don't bash me.
I have a web framework created by someone and I need to learn to use it.
Let's say I have this HTML form:
<form action="servletX" method="get">
<input name="action" value="search" type="submit">
</form>
When the search button is submitted, inside of the servlet, is extracted, based on the word "action" (this is forced by the structure of the framework), what kind of action needs to be made.
One more thing: the action, in this case, "search" is in fact the key for a proprieties file which is read in one of the classes.
My question is:
How can I implement a search feature, using this framework.
I want to have a field where I enter the data based on which the search is made and 2 submitted buttons (2 options)
Something like this:
<form action="servletX" method="get">
<p>Search
<input name="action" type="text">
<input name="action" value="Option1" type="submit">
<input name="action" value="Option2" type="submit">
</p>
</form>
Use buttons or radio buttons instead of generic inputs. They are intended for mutually-exclusive options of the sort required here.