CODEWITHSUNDEEP
jquery
divz
divz

Reputation: 7957

Jquery remove duplicate code

Am new to Jquery.

I want to insert and edit values on the same button click.The following code is am using .It is working properly and using common code in both insertion and deletion.

function save(){

if($('#job').val()==" "){
    if(value!=false){
    var data = {        
        "names": $('#names').val(),            
        "server": $('#server').val()
    };
    $.ajax({
        type: 'post',
        url: "/insert",
               });
  }
}
else{

    if(value!=false){
    var data = {

    };
    $.ajax({
        type: 'post',
        url: "/edis",
                   }
    });
  }
}
}

Is there any possible ways to remove code duplication and how to compress this code

Upvotes: 0

Views: 136

Answers (4)

Praveen
Praveen

Reputation: 56509

1) Extend the scope of variables within saveToDB method.

var data = {        
        "names": $('#names').val(),
        "os": $('#OS').val(),
        "browser": $('#browsers').val(),
        "version": $('#version').val(),
        "scripttype": $('#testscripts').val(),
        "server": $('#server').val()
    };
var urlLink;
var message;

2) From your code it seems, value variable is playing the vital role, there make it as first condition.

3) while assingning data object will not have job so here in this condition you can add it.

if($('#jobid').val()==" "){
 urlLink = "/insertJobs";
 message = "job insertion success";
}
else {
 data.job = $('#jobid').val();  // Add job to data object
 urlLink = "/editJobs";
 message = "job Updated succesfully!!";
}

Finally your code will be like

function saveToDB(){
    var value= pageValidation();
    if(value!=false){
        var data = {        
                "names": $('#names').val(),
                "os": $('#OS').val(),
                "browser": $('#browsers').val(),
                "version": $('#version').val(),
                "scripttype": $('#testscripts').val(),
                "server": $('#server').val()
            };  
        if($('#jobid').val()==" "){
         urlLink = "/insertJobs";
         message = "job insertion success";
        }
        else {
         data.job = $('#jobid').val();
         urlLink = "/editJobs";
         message = "job Updated succesfully!!";
        }           
        $.ajax({
            type: 'post',
            url: urlLink,
            dataType: "json",
            data: data,
            success: function (response) {
                console.log(message);
                console.log(response);
                displayjobs();
            }
        });
      }
}

Upvotes: 1

Nikolaj Zander
Nikolaj Zander

Reputation: 1270

UPDATED

function saveToDB(){
var value= pageValidation();
var job;
var msg;

if(value!=false){

var data = {
        "jobid": $('#jobid').val(),
        "names": $('#names').val(),
        "os": $('#OS').val(),
        "browser": $('#browsers').val(),
        "version": $('#version').val(),
        "scripttype": $('#testscripts').val(),
        "server": $('#server').val()
    };

if($('#jobid').val().trim() == ""){
    job = "/insertJobs";
    msg = "job insertion success";
    delete data['jobid'];
}
else{
    job = "/editJobs";
    msg = "job Updated succesfully!!";
}



    $.ajax({
        type: 'post',
        url: job,
        dataType: "json",
        data: data,
        success: function (response) {
            console.log(msg);
            console.log(response);
            displayjobs();
        }
    });
  }
}

Upvotes: 2

Dejv
Dejv

Reputation: 954

In your main condition you duplicate almost the same code. You can convert this code into function and cover small differences with function parameters. Calling this function in main condition should do the trick here.

Here is my customization (I didn't try the code):

function saveToDB(){
  var value = pageValidation();

  if($('#jobid').val()==" ") manageData('/InsertJobs'); else manageData('/editJobs', true);

}

function manageData(url, value = false){
  var data = {
      "jobid": $('#jobid').val(),        
      "names": $('#names').val(),
      "os": $('#OS').val(),
      "browser": $('#browsers').val(),
      "version": $('#version').val(),
      "scripttype": $('#testscripts').val(),
      "server": $('#server').val()
  };
  $.ajax({
      type: 'post',
      url: url,
      dataType: "json",
      data: data,
      success: function (response) {
          if($value == false) console.log("job insertion success"); else console.log("job Updated succesfully!!");
          console.log(response);          
          displayjobs();
      }
  });
}

Upvotes: 1

Arvind Bhardwaj
Arvind Bhardwaj

Reputation: 5291

function saveToDB() {
    var value= pageValidation();
    var type = "update";
    if ($('#jobid').val()==" ") {   //set the flag
        type = "insert"
    }
    if(value!=false) {
        var data = {        
            "type": type, //See this, insert/update, check this on server side
            "names": $('#names').val(),
            "os": $('#OS').val(),
            "browser": $('#browsers').val(),
            "version": $('#version').val(),
            "scripttype": $('#testscripts').val(),
            "server": $('#server').val()
        };
        if (type == "update") {
            data.jobid = $('#jobid').val();
        }
        $.ajax({
            type: 'post',
            url: "/insertJobs",
            dataType: "json",
            data: data,
            success: function (response) {
                if (type == "insert") {
                    console.log("job insertion success");
                } else {
                    console.log("job Updated succesfully!!");
                }
                console.log(response);
                displayjobs();
            }
        });
    }
}

Upvotes: 1

Related Questions