How to delete initial field value when user clicks on respective box? - html

I want to know if its possible writing some code which will delete an initial value from a form when the user clicks on the corresponding form (described in the following example)?
class example(forms.Form):
name = forms.CharField()
email = forms.EmailField()
descr = forms.CharField(initial='Please insert a relevant description ...')
I dont want to use the help_text attribute.
PS: For a better understanding I could make an analogy with java onclick event

One way is to use HTML5's placeholder attribute directly from Django:
descr = forms.CharField(widget=forms.TextInput(attrs={
'placeholder': 'Please insert a relevant description ...'}))
The unique constraint is that it is not yet supported by Internet Explorer.

Because it's a webservice you'll have to use javascript. If you use jQuery, something like this:
$(document).ready(function(){
$('#id_descr').one('click', function(){
$(this).val('');
});
});

for the backend part, have a look at this answer. For the frontend, you may wish to add a html5 shiv to get placeholders in legacy browsers

Related

getting (" placeholder ") input attribute in django

I want to get my placeholder input attribute, when a user submit the form. How can it be done in django framework?
for example,
I want it to be done like this:
def get_attr(request):
plh = request.POST.get('placeholder')
I know that the code above isn't correct, because the POST method doesn't have that attribute.
So, what can I do?
It has nothing to do with Django, you can user JS for getting placeholder easily.
Assign a ID to your input field
Using JavaScript
document.getElementById("demo").placeholder
Using Jquery
$('#weight').attr('placeholder')
Then you can use this value in any way you want to

How to make a angucomplete-alt tag 'required' in a form

I am using angucomplete-alt in many places of my web application (in forms), but i cant make the autocomplete fields as a 'required' field, even thought i've used the 'field-required' attribute.
angucomplete-alt#sectorSuggested(field-required= true,placeholder='Search sectors', local-data='sectors', selected-object='onSectorSelected', search-fields='Sector', pause='300', minlength='1', title-field='Sector',input-class="form-control form-control-small", name='sector')
how do i make it required field, please help :)
Going off of the documentation and examples I can see here, it looks like the attribute should be
field-required="true"
In the above example, his element looks like this:
<div angucomplete-alt="" id="ex8" placeholder="Search countries" pause="100" selected-object="countrySelected8" local-data="countries" search-fields="name" title-field="name" minlength="1" input-class="form-control form-control-small" match-class="highlight" field-required="true" class="ng-isolate-scope">
Additionally, if you have many required fields, his documentation states:
Set custom class name for required. Unique class names need to be set
when you have multiple directives to validate
You can do this, using the field-required-class attribute.
Taken from here
you can use field-required = "true"
and it should work fine.

Custom Input Names on GravityForms

How can I add custom input names to gravity forms? I need to submit a form to a third party service that requires very specific form names.
My current idea is to write a bit of jQuery to dynamically rename everything when the page loads. Obviously this isn't ideal.
Gravity Forms: http://www.gravityforms.com/
After contacting the makers of Gravity Forms, it sounds like they don't support custom input names. As a workaround, I wrote a bit of jQuery to rename inputs with the correct form names. For example:
$("input#input_1_1").attr("name","first_name");
Just put some code in functions.php and fill out the form which will then email you with a list of the id names, they are the same names that you can fine using developer tools etc. This was just faster for me. Then change the code to have it post via curl with different input names.
This uses php so it's on the server to handle. That way you don't have to worry about people with JS disabled in their browser.
http://0to5.com/gravity-forms-submitting-forms-to-3rd-party-applications/
Add a new field (HTML field). In content settings of this field add this javascript with script tags
Non-jquery solution:
document.getElementById("input_14_4").setAttribute("name", "email");
Another solution i found here
https://docs.gravityforms.com/gform_field_content/
add_filter( 'gform_field_content', function ( $field_content, $field , $value, $lead_id, $form_id) {
if ( $form['id'] != 14 ) {
//not the form whose tag you want to change, return the unchanged tag
return $field_content;
}
if ( $field->id == 3 ) {
return preg_replace( "|name='(.*?)'|", "name='email'", $field_content );
}
return $field_content;
}, 10, 5 );

HTML link with Ajax

I have 6 different links,and each link is going to call a different Ajax function.
I'm using the <a href> tag because I want it to appear as a link....Can I use this tag to call the Ajax function? or it only works with URL links?
THANKS!
This is how I call mine. I give my elements a class name such as 'clickable' then use Jquery's click function as so.
$('.clickable').click(function() {
//do ajax
});
Then in the function, I get the id of the element as so. var id = this.id, this will get the unique id of the element.
After that I use the $.post method of Jquery, the shorthand version of ajax and complete whatever call you need to make when the user clicks that link using the id.
Of course, in my case I never use the anchor tag, I just make is a button or apply the . click to the element I wish to add the ajax call to, but you could just surround the "link" in a span or a div to simulate the same effect.
Hope this helps in some way or another.
Text
or even as they wrote, with jquery
Text
<script type="text/javascript">
$(document).load(function(){
$('#blabla').click(function(){
alert("Clicked");
});
});
</script>
Yes you can incorpore the link in the following way:
- on your link you can write ...
Here you can see further information about this topic:
What is the difference between the different methods of putting JavaScript code in an ?
You can extract the value of the href attribute and use it for your AJAX call...
(it is actually the proposed way to handle it..)
yes you can, if any client side script functions (javascript or jquery) applied than it will execute first.

HTML/CSS form field with suggestion

What is it called or where can I find code for placing a 'suggestion' or grayed out text in a form field box that doesn't get pass as a value. I know i can prepopulate it, but want to use it to only provide guidance. Example, box that says " "
The terminology you're referring to is called a watermark.
There are many existing Javascript solutions written for this already, like this one.
JavaScript will do this. I've used the jQuery framework, for example:
Setting the value:
$('#comment_box').val('Optional comment..');
On click, removing the value:
$('#comment_box').val('');
On submit:
if (comment == 'Optional comment..'){
comment = '';
}
And submit your comment. I've left out the functions here but you can get an idea.
HTML5 has a placeholder attribute supported by many modern browsers.
(But alas not MSIE.)
The above-linked article explains how to test for support and implement a javascript fallback.
use
<input type=text disabled value='...'/>
(disabled wont pass the values, whereas readonly will pass the value)
I think what you are referring to is a watermark
http://www.asp.net/ajax/ajaxcontroltoolkit/Samples/TextBoxWatermark/TextBoxWatermark.aspx
or
there are jquery defaultvalue plugins