jQuery autocomplete on multiple input fields - php

I am using jQuery auto-complete. I have download this script from http://code.google.com/p/jquery-autocomplete/. I want to use this on multiple fields. Please help me thanks.
$("#input").autocomplete("samefile.php");
$("#input").autocomplete("samefile.php");
thanks

the hash mark means you are using IDs to select elements. there should however never be more than one element in your page with the same ID. for instance,
<input id="test" /><input id="test" />
is invalid HTML.
The second problem, is that it appears you are trying to find tag names, which means you should simply leave out the hash mark from your code, and JQuery will apply your methods to all of the tags with that tag name,
$("input").autocomplete("samefile.php");
will apply autocomplete to all input tags on your page.
Third, I would use classes instead of tag names incase you ever want to have an input on your page that does not use the same auto complete. So your html would look like this,
<input class="auto" /><input class="auto" />
and your JQuery would look like this.
$(".auto").autocomplete("samefile.php);
I also wonder where you are calling your JQuery from?

You should use a less specific selector to mark multiple fields as autocomplete in one statement.
Maybe you can assign a class of type ".autocomplete" and then use that.
<input type=textbox" name="txt1" class="autocomplete"/>
<input type=textbox" name="txt2" class="autocomplete"/>
$(".autocomplete").autocomplete("samefile.php");

Related

Store the content of an HTML element into a PHP variable?

I want to store the content of a span element into a PHP variable. I want to use this in a relationship to the editable content tag. So that I finally have something like an input field. (In my project, I don't want to use normal input fields)
Thank you
"something like an inputfield"
You can use this:
<input type="hidden" name="yourname" value="thevalue" />
Hidden property sets this will not be visible
http://webdesign.about.com/od/htmltags/p/input-hidden-tag.htm

jQuery validate not working when using php fields with brackets

I'm working on a project where the document object model is loaded from jqote templates that use input names with brackets to generate arrays on postback. The project was built this way so the rows could be sortable using jquery sortable prior to postback.
<form id="the_form">
<input type="text" id="field1" name="options[]" /><br />
<input type="text" id="field2" name="options[]" /><br />
<input type="text" id="field3" name="options[]" /><br />
<input type="submit" value="submit" />
</form>
My problem is that jquery validate does not play nice with the field names that include brackets. Sometimes it validates and sometimes it misses a field or two. I've been reading a lot of other posts stating this should work and I am wondering if I am doing something wrong or if there's a work around.
jQuery("#the_form").validate({
rules: {
"options[]": {
required: true
}
}
});
I've created a jsFiddle so others can see what I'm experiencing. If you run the jsFiddle and select Submit in the form, you'll immediately notice it only validates the first field, however if you tab through the fields, you see a different behavior. Thanks!
http://jsfiddle.net/PV6j7/1/
That is because they are currently all the same name.
They need to be different names in order to work
Quote:
"...My problem is that jquery validate does not play nice with the field names that include brackets."
This is true, but that's easily fixed with quotation marks. However, "brackets" are not really the problem here.
The root problem is that the plugin will not operate properly without a unique name on each field. There is no way around this.
Using a jQuery $.each() to assign rules via the .rules('add') method is discussed elsewhere, but it's been disproved as a viable workaround. That's because the root problem is not with selecting elements & assigning rules; the problem is that the plugin uses the name attribute to keep track of the elements being validated. This is impossible if the name is the same on all.
failed jQuery .each() demo
try this:
jQuery("#the_form").validate({
rules: {
"options": {
required: true
}
}
});

How to change html controls with php as the user provides input?

Pretty new to PHP and I'm wondering if there's a way to dynamically modify which inputs are available on an HTML form using PHP without the form data needing to be submitted. I'm making a site with a calendar for a teacher and I need to make the "duedate" input in this form gray out as soon as the user selects the option "announcement."
<form action="calendaradd.php" method="post">
Event name: <input name="eventname" type="text" autocomplete="off"/></br>
Event type: <select>
<option value="homework">Homework</option>
<option value="announcement">Announcement</option>
</select>
Event date: <input type="date" name="eventdate"></br>
Due date: <input type="date" name="duedate"></br></br>
<input name="submit" type="submit" value="Submit"/>
</form>
Many thanks. Also, am I using the select/option control correctly? Are the options supposed to use value attributes instead of name?
Bind an onchange to the select, and the if the value matches your criterium, set the input as disabled:
Using jQuery to make it easier:
$('#select').on('change',function(){
var value = $(this).val();
if(value == 'announcement'){
$('#duedate').prop('disabled',true);
}
else{
$('#duedate').prop('disabled',false);
}
});
You need to supply the proper IDs to the elements (you can get them also with DOM traversing, but an ID will be faster and easier), though. Also, your select is missing the name attribute, you need it in order to fetch the value server-side.
You might wanna take a look at some client-side scripting, since server-side (as in PHP) cannot alter a page's contents once they've been loaded. Check it out here
You can set the onTextChanged event to a javascript function that changes the attribute disabled in the input to true.
Honestly, the easiest, in my opinion, would be some jQuery animation. You could make it where when the user clicks on the announcement input the due date changes color and other attributes.
JQuery is the way to go, and easier than PHP when it comes to something like this.

POST a custom Tag?

I have the following input in a form
<input name="email" type="text" id="email"size="50" english="Email address" />
I have a custom tag called english, My question is can I send this as post data and can I recover it on my new page ?
Any help would be much appreciated , Thanks
If you use JavaScript to submit your form, you can read you custom tags' values ad append them to the form data to send. Otherwise, clean HTML form just submits only input tags value.
The best method I can think of right now is to have hidden field with the label as value. Like
<input name="email_label" type="hidden" id="email_label" value="Email address" />
The short answer is: no. The post data received from the HTML in your question will be an array with email as the key, and whatever the user typed as the value.
The solution depends on the problem you're trying to solve. Consider using a hidden input tag instead. For example:
<input name="language" type="hidden" value="English" />
Alternatively, a neater solution would be to store the language in the session (assuming that does what you need). You should never rely on the front end of a website "telling" the back end stuff like this, at least to a certain degree. The back end should just "know".

Remove text from fields on input

How do I make the text disappear like the way some fields work here on stackoverflow once I start putting in text? I tried out the different 'on'-actions in HTML but that didn't really do what I wanted.
Thanks.
You can do it with onfocus/onblur events. For example:
<input type="text" value="search" onfocus="if(this.value=='search')this.value=''"/>
If you click on this input field, the default text "search" will disappear. The onfocus event handler checks if this input field has the value of "search" and if so then clears it, in other cases (user has already typed something in) leaves everything as is.
Presumably you mean "Labels which appear inside the input".
If you want to do this in a sane, accessible, semantic way — use a <label>, if JS is available then position it under the element, and onfocus/onblur change classes around based on the value of the element.
I knocked up a simple example at http://dorward.me.uk/tmp/label-work/example.html using jQuery (all the source that isn't part of the jQuery library is embedded in the HTML of that document for easy reading).
jQuery would make this easy work;
http://www.jsfiddle.net/TshDN/
If you are using HTML 5 you could use the placeholder attribute.
http://dev.w3.org/html5/spec/Overview.html#the-placeholder-attribute
use the onFocus() in javascript
<input type="text" onfocus="if(this.value == 'value') { this.value = ''; }" value="value" />

Categories