jQuery : clear file input field

Use this to reset the form fields:

$('#form_id').each(function(){
    this.reset();
});

Reference:
http://stackoverflow.com/questions/7769489/clear-file-input-field-using-jquery

Jquery: get element by name attribute

Use

$('[name="ElementNameHere"]').doStuff();

Reference:
http://stackoverflow.com/questions/9680037/how-do-i-select-an-element-with-its-name-attribute-in-jquery

Jquery: async form submit plugin

Here is a nice and simple jquery plugin to work with async from submits:

http://malsup.com/jquery/form/

jQuery: jquery-1.10.2.min.map is triggering a 404 (Not Found)

"A source map it's a way to map a combined/minified file back to an unbuilt state. When you build for production, along with minifying and combining your JavaScript files, you generate a source map which holds information about your original files. When you query a certain line and column number in your generated JavaScript you can do a lookup in the source map which returns the original location"

So,you have some options:
1. Stop using the .min.js file and use the .js file (recomended for development environmens)
2. Downlad the .map file and add it to your libs: http://jquery.com/download/ Select the option: "Download the map file for jQuery x.xx.x"
3. Delete, from your .min.js file, the  line:
//@ sourceMappingURL=jquery-1.10.2.min.map 

References:
http://stackoverflow.com/questions/18365315/jquerys-jquery-1-10-2-min-map-is-triggering-a-404-not-found
http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/

Jquery: select element by name

Use:
$('[name="ElementNameHere"]').doStuff();

Reference:
http://stackoverflow.com/questions/9680037/how-do-i-select-an-element-with-its-name-attribute-in-jquery

JQuery: simple slider form

Here is a great and simple sample that shows a form using sliders without using any slider lib, just jquery and jqueryui:

http://webexpedition18.com/articles/how-to-create-a-multi-step-signup-form-with-css3-and-jquery/

Jquery: testing if something has display none

User the .css() method, ie:

$("#labelId").css("display") == "none"

Resource:
http://stackoverflow.com/questions/178325/testing-if-something-is-hidden-with-jquery

Jquery: add readonly to HMTL5 input tag

Use attr method:

$('#inputId').attr('readonly', true);

Reference:
http://stackoverflow.com/questions/1306708/add-readonly-to-input-jquery

Jquery: get selected item value of a dropdown - combobox element in jQuery

Use $('#{Id} :selected')

var selectedItem = $('#dropDownId :selected') // selected item object
var selectedItemText = $('#dropDownId :selected').text(); // selection text
var selectedItemId = $('#dropDownId :selected').attr('id'); // selection id

Reference:
http://stackoverflow.com/questions/2780566/to-get-selected-value-of-a-dropdown-select-element-in-jquery

JQuery: remove content of div

To remove all the content of a div you can use .empty() function:

$('#mydiv').empty();

Reference:
http://stackoverflow.com/questions/652917/in-jquery-want-to-remove-all-html-inside-of-a-div

Jquery: Change div background color using animate

You cannot use animate to animate colors without jQuery UI. So use

...

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
...
...
...

$( "#effect" ).animate({
          backgroundColor: "#fff",
          width: 240
        }, 1000 );


...
...
Resource:
http://stackoverflow.com/questions/6492418/changing-background-of-a-div-using-jquery
http://jqueryui.com/animate/

JQuery Autocomplete: event when suggestion is selected

There is an event when suggestion is selected, use the select event:

$("#username").autocomplete({
                            source: availableTags
                            , select: function( event, ui ) {
                                alert("hi");
                            }
                        });

Reference:
http://api.jqueryui.com/autocomplete/#event-select
http://stackoverflow.com/questions/7733315/jquery-autocomplete-event-select

Jquery: change label text

in html file:

...
<label id="resultadoconsulta">my Old Text</label>
...

in javascript:

$('#resultadoconsulta').text("my New Text");

Resource:
http://stackoverflow.com/questions/3584145/change-text-of-label-in-jquery

Javascript: Remove Duplicate Values from Array

Using JQuery:


var names = ["Mike","Matt","Nancy","Mike","Jenny","Nancy","Carl"];
var uniqueNames = [];
$.each(names, function(i, el){
    if($.inArray(el, uniqueNames) === -1) uniqueNames.push(el);
});
alert(uniqueNames);// ["Mike","Matt","Nancy","Jenny","Carl"];

Resource:
http://stackoverflow.com/questions/9229645/remove-duplicates-from-javascript-array

Javascript: adding options to select dynamically

Your html:


<select id="estadosiniciales">
                    <option value ="sydney">Sydney</option>
                    <option value ="melbourne">Melbourne</option>
                    <option value ="cromwell" selected>Cromwell</option>
                    <option value ="queenstown">Queenstown</option>
</select>

Your Javascript:


var newOption = new Option("newStateName","newStateName");
var selectIni = $("#estadosiniciales"); // using Jquery
selectIni.append(newOption)


Resources:
http://www.devguru.com/technologies/ecmascript/quickref/option.html
http://stackoverflow.com/questions/4647863/trouble-dynamically-adding-options-to-select

JQuery: parse json text to json Object

var obj = jQuery.parseJSON('{"name":"John"}');
alert( obj.name === "John" );


Reference:
http://api.jquery.com/jQuery.parseJSON/

Simple Ajax with cherrypy and jQuery

Be aware of having installed CherryPy 3.X, that's all.

Source:
http://ginstrom.com/scribbles/2010/03/07/simple-ajax-with-cherrypy-and-jquery/