Jquery all time methods and functions

·

,
jquery

Hello, welcome to therichpost.com. In this post, I will tell you Jquery all time methods and functions. I personally like jquery very much. Most of my code is full with jquery. When I stuck in php or other language then that stuckness I remove with jquery code.

Today In this post, you will more code related to jquery.

1. jquery differents click functions:

$(“Div#id”).click(function(){
//you code
});

// for dynamic htmls

$(“Div#id”).on(‘click’, function(){
//you code
});

$(“Div#id”).on(‘click’, ‘.divclass’, function(){
//you code
});

2. Open Bootstrap Modal Popup with jquery:

$(‘#ModalId’).modal(‘show’);

3. Add css to div with jquery:

$(‘#DivId’).css(‘width’, ‘100px’);

4. Remove commas in array data with jquery:

arr.join(“\n”)

There are so many jquery code, tricks and i will let you know all. Please do comment if you any query related to this post. Thank you. Therichpost.com

Comments

48 responses to “Jquery all time methods and functions”

  1. alexa Avatar
    alexa

    // jquery custom validations on button click

    $(“.formbtn”).on(“click”, function(){

    var i=0;
    var j=0;
    if($(“#firstname”).val()==””)
    {
    i = 1;
    $(“#firstname”).css(“border”, “1px solid red”);
    }
    else
    {
    i = 0;
    $(“#firstname”).css(“border”, “1px solid rgba(0, 0, 0, 0.15)”);
    }

    if($(“#lastname”).val()==””)
    {
    j=0;
    $(“#lastname”).css(“border”, “1px solid red”);
    }
    else
    {
    j = 0;
    $(“#lastname”).css(“border”, “1px solid rgba(0, 0, 0, 0.15)”);
    }

    if(i==0 && j==0)
    {
    alert(“All Done :)”);
    }
    else
    {
    alert(“All Not Done :(“);
    }

    });

  2. alexa Avatar
    alexa

    // get select box text value on change event

    $(“.addnewservice .select-service”).on(“change”, function(){
    var optionSelected = $(this).find(“option:selected”);
    var valueSelected = optionSelected.val();
    var textSelected = optionSelected.text();

    });

  3. therichpost Avatar
  4. alexa Avatar
    alexa

    Here more:
    ========

    set default flag in intl-tel-input
    open -> intlTelInput.min.js -> find-> preferredCountries-> add county code:
    That is it

  5. sneha Avatar
    sneha

    Please help:

    How to write a JavaScript code using if condition….user status should active its show green color button on…..it user status is disable it shows red color button

  6. therichpost Avatar

    Here you can check the answer:

    if($(“#divwhereuserstatus”).text()==”active “)
    {
    $(“#button”).css(“background-color”, “green”);
    }
    else
    {
    $(“#button”).css(“background-color”, “red”);
    }

    Hope this solve your problem..

  7. sneha Avatar
    sneha

    sir how to do this through using ajax call using if condtion in javascrit

  8. therichpost Avatar

    for ajax use this:

    $.ajax({
    type: ‘POST’,
    url: “url.php?action=saveData”,
    data: data,
    success: function(resultData) { if($(“#divwhereuserstatus”).text()==”active “)
    {
    $(“#button”).css(“background-color”, “green”);
    }
    else
    {
    $(“#button”).css(“background-color”, “red”);
    } }
    });

  9. sneha Avatar
    sneha

    okay sir

  10. sneha Avatar
    sneha

    success: function( result){
    console.log(result);
    if(userstatus == 1){
    $(“#active”).show();
    }
    else{

    $(“#inactive”).show();
    like this but i m not getting

  11. sneha Avatar
    sneha

    success: function( result){
    console.log(result);
    if(userstatus == 1){
    $(“#active”).show();
    }
    else{

    $(“#inactive”).show();
    like this but i m not getting

  12. sneha Avatar
    sneha

    but i m not getting output sir

  13. therichpost Avatar

    give me your file or complete code for this..

  14. sneha Avatar
    sneha

    var error = “”;
    $(document).ready(function(){
    $(“#submit”).on(“click”, function(){
    $(“.error”).html(“”);
    var number = $(“#zip”).val(),
    userstatus = 1;

    flag = true;

    if(number === “” || !regex(number)){
    error= “Enter correct 6 digit number Eg:123456”;
    flag = false;
    }

    if(!flag){
    $(“.error”).html(error).css({“color”:”#FF0000″ , “font-weight”:”bold” , “text-align”: “center” , “margin”: “px 0px”});
    }
    else{
    $.ajax({

    data : {“layout” : 1000, “fname” :name ,”lname”:lname, “email”: email, “password” : password , “gender” : gender},
    method : “POST”,
    success: function( result){
    console.log(result);
    if(userstatus == 1){
    $(“#active”).show();
    }
    else{

    $(“#inactive”).show();

    }
    },

    })
    }

    })

    })

    html

    Enter Your Details
    Active
    Inactive

  15. sneha Avatar
    sneha

    Enter Your Details
    Active
    Inactive

  16. sneha Avatar
    sneha

    var error = “”;
    $(document).ready(function(){
    $(“#submit”).on(“click”, function(){
    $(“.error”).html(“”);
    var number = $(“#zip”).val(),
    userstatus = 1;

    flag = true;

    if(number === “” || !regex(number)){
    error= “Enter correct 6 digit number Eg:123456”;
    flag = false;
    }

    if(!flag){
    $(“.error”).html(error).css({“color”:”#FF0000″ , “font-weight”:”bold” , “text-align”: “center” , “margin”: “px 0px”});
    }
    else{
    $.ajax({

    data : {“layout” : 1000, “fname” :name ,”lname”:lname, “email”: email, “password” : password , “gender” : gender},
    method : “POST”,
    success: function( result){
    console.log(result);
    if(userstatus == 1){
    $(“#active”).show();
    }
    else{

    $(“#inactive”).show();

    }
    },

    })
    }

    })

    })

  17. sneha Avatar
    sneha

    HTML

    Enter Your Details
    Active
    Inactive

  18. therichpost Avatar

    Okay let me know you….

  19. sneha Avatar
    sneha

    how to pass this value n id at the time of onsubmit in javascript

  20. therichpost Avatar

    here is an example:

    document.getElementById(“myForm”).onsubmit = function() {
    alert(document.getElementById(“textboxid”).value);
    }

  21. sneha Avatar
    sneha

    sir i want to learn javascript n jquery can u suggest links n tutorilals

  22. therichpost Avatar

    I can teach you..

  23. nina sheikh Avatar
    nina sheikh

    sir if i need any help regarding coding validation wud u guide me

  24. nina sheikh Avatar
    nina sheikh

    sir y is localstorage.getitem is used

  25. nina sheikh Avatar
    nina sheikh

    its like when we login as a user his details shud b appeared on top right corner ..like example in gmail we login n compose mail everythin n wen to signout wil go to our profile pic n signout ryt…..it should show our profile until we are in that page ..otherwise logout

  26. therichpost Avatar
    therichpost

    The localstorage.getitem() method of the Storage system, when passed a key name, will return that key’s value.:
    ======================
    var currentColor = localStorage.getItem(‘bgcolor’);
    document.getElementById(‘bgcolor’).value = currentColor;

    //also you can store temprary value like below method
    // Save data to the current local store

    localStorage.setItem(“username”, “John”);

    // Access some stored data
    alert( “username = ” + localStorage.getItem(“username”));

  27. therichpost Avatar
    therichpost

    They are called sessions. Store user information through login.

  28. nina sheikh Avatar
    nina sheikh

    //also you can store temprary value like below method
    // Save data to the current local store

    localStorage.setItem(“username”, “John”);

    // Access some stored data
    alert( “username = ” + localStorage.getItem(“username”));

    how to access using json

  29. nina sheikh Avatar
    nina sheikh

    yea sessions….n hav to access data thru json

  30. nina sheikh Avatar
    nina sheikh

    yea these session hav to access it through json

  31. therichpost Avatar
    therichpost

    First tell me which framework you are working?

  32. therichpost Avatar
    therichpost

    First tell me which framework you are working?

  33. nina sheikh Avatar
    nina sheikh

    bootstrap

  34. therichpost Avatar
    therichpost

    we cannot get json data in bootstrap or you can create it static data?

  35. nina sheikh Avatar
    nina sheikh

    how

  36. therichpost Avatar
    therichpost

    with this we create custom json data in js:

    var data = {‘name’: ‘therichpost’, ‘age’: 1};

  37. therichpost Avatar
    therichpost

    with this we create custom json data in js:

    <script type=”text/javascript”>
    var data = {‘name’: ‘therichpost’, ‘age’: 1};
    </script>

  38. nina sheikh Avatar
    nina sheikh

    this thing hav to put in js folder..
    actually i tried with
    if(session === “”){
    localStorage.getItem(“session”);
    {“session” :
    { “name”: “abc”}
    }
    window.location=”login.php”;
    }

  39. therichpost Avatar
    therichpost

    try this:

    var session = { ‘session’: ‘abc’};
    localStorage.setItem(‘session’, JSON.stringify(session));
    session = JSON.parse(localStorage.getItem(‘session’));
    if(session[‘session’]!=””)
    {
    window.location=”login.php”;
    }

  40. therichpost Avatar
    therichpost

    try this:

    var session = { ‘session’: ‘abc’};
    localStorage.setItem(‘session’, JSON.stringify(session));
    session = JSON.parse(localStorage.getItem(‘session’));
    if(session[‘session’]!=””)
    {
    window.location=”login.php”;
    }

  41. nina sheikh Avatar
    nina sheikh

    i tried

  42. therichpost Avatar

    Okay then what?

  43. nina sheikh Avatar
    nina sheikh

    its not taking

  44. therichpost Avatar

    but I checked above code and it is working.
    Did you paste that code in script tags?

  45. therichpost Avatar
    therichpost

    we can get localStorage data in whole website:
    if (localStorage) {
    var data = JSON.parse(localStorage.getItem(‘session’));
    alert(data[‘session’])
    }