Find and replace one by one in jquery /javascript

How to replace string one at a time in jquery / javascript ?

 Below is a simple example explaining that how to replace string one at a time.

Example: Replace "jquery"  with cpas "JQUERY" one by one.

click here for demo

Note* :For  below example jquery is not required and code is compatible with most of the major browsers.

//string  "How to replace string in jquery or javascript one at a time !!!" is repeated twice //in text

var text = " How to replace string in jquery or javascript one at a time !!! How to replace string in jquery or javascript one at a time !!! How to replace string in jquery or javascript one at a time !!! ";

var textToReplace = "jquery";
var textReplaceWith = "JQUERY"
    
var numOfOccur = text.match(/jquery/g).length;

//replace content one by one
while(numOfOccur-- >= 0){
    text = text.replace(textToReplace ,textReplaceWith );
}
$("#content").html(text );

Check Below links :

Find and Replace all in jquery

Find and Replace all in jquery

             I was looking for find and replace all  in jquery, but I found that javascript have very nice library for regular expression.Also it is compatible with all the browser. Below is syntax and simple example:

Syntax :

outputString = searchIn.replace(new RegExp("YourExpression", 'g'),"String to Replaced");

or 

strings = strings.replace(/hi/g," bye");

where /g represents all the occurrences of matched string. 


Try out example :

Click  buttons on menu bar to run script. Also using + button you can edit script and test as per need :
 

Ajax In Jquery

  

1)Ajax and Jquery

   Below is the simple example of how to do ajax call in jquery. Below example can be used for  both GET and POST requests by changing type to GET or Post .


var requestParams = {

      name:'James Bond',

      id  :'007'

};

//below param method take cares of special characters in data

requestParams = jQuery.param(requestParams);

$.ajax({

  type : 'GET',//GET Or POST 

  url  : "details.html",

  cache: false, //get fresh copy of details.html instead of cahced one

  data :requestParams,

 

  success: function(response, textStatus, jqXHR){

        //set data in div

        $("#detailsDiv").html(response);

  },

  // callback handler that will be called on error

  error: function(jqXHR, textStatus, errorThrown){

      // log the error to the console

      console.log(

          "The following error occured: "+

          textStatus, errorThrown

      );

  }

 

});

2) Other Simple way for Ajax  GET using JQuery .load()

var params = {    id:'007',

                  name:'James Bond'

            };

 //jquery param method returns serialized parameters

 //(it takes cares of special characters )

var url ="/loadDetails?"+jQuery.param(params);;

//load the details in detailsDiv.

 $("#detailsDiv").load(url, function(response, status, xhr) {

      if (status == "error") {

          var msg = "Sorry but there was an error getting details ! ";

          $("#detailsDiv").html(msg + xhr.status + " " + xhr.statusText);

      }

});