Tuesday 16 April 2013

Multiple Select Box onselect/onclick Jquery Event


Attaches a change event to the select that gets the text for each selected option and writes them in the div. It then triggers the event for the initial text draw.

!DOCTYPE html>
<html>
<head>
  <style>
  div { color:red; }
  </style>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
  <select name="garden" multiple="multiple">
 
    <option>Flowers</option>
    <option selected="selected">Shrubs</option>
    <option>Trees</option>
    <option selected="selected">Bushes</option>
 
    <option>Grass</option>
    <option>Dirt</option>
  </select>
  <div></div>
<script>
$("select").change(function () {
  var str = "";
  $("select option:selected").each(function () {
        str += $(this).text() + " ";
      });
  $("div").text(str);
})
.trigger('change');
</script>
 
</body>
</html>
Read More

Thursday 11 April 2013

Length of class


var n = $("#id").length;
Read More

Multiple Checkbox Select/Deselect using jQuery

<SCRIPT language="javascript">
$(function(){
 
    // add multiple select / deselect functionality
    $("#selectall").click(function () {
          $('.case').attr('checked', this.checked);
    });
 
    // if all checkbox are selected, check the selectall checkbox
    // and viceversa
    $(".case").click(function(){
 
        if($(".case").length == $(".case:checked").length) {
            $("#selectall").attr("checked", "checked");
        } else {
            $("#selectall").removeAttr("checked");
        }
 
    });
});
</SCRIPT>
Read More

Wednesday 10 April 2013

Set Value In Hidden Field Using JQuery

$('input[name="currentPage"]').attr('value',currentPage);
Read More

Select Value From Input Box onChange



 $("#whereToId").change(function () {
   var str = "";
   $("#whereToId option:selected").each(function () {
   str += $(this).val() + " ";
   });
   alert(str);

   
 })
.change();
Read More

Jquery Html Append



<!DOCTYPE html>
<html>
<head>
  <style>
  p { background:yellow; }
</style>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
  <p>I would like to say: </p>
  <div id="mydiv"></div>
<script>
  $("p").append("<strong>Hello</strong>");
  $("#mydiv").append("<p><strong>Hello</strong></p>");
  
</script>

</body>
</html>
Read More

Blogger

Related Posts Plugin for WordPress, Blogger...