ctmong
ctmong

Reputation: 11

I want to fix the code concisely

var template is used as redundant I want to know how to fix it so you can use this section only once

function pluscal(data) {
  var idx = index++
    var form = parseInt($("#plusstr1").val()) + $("#plus_op").text() + parseInt($("#plusstr2").val())
  var cal = parseInt($("#plusstr1").val()) + parseInt($("#plusstr2").val())
  var template = "<tr>" +
    "<td>" + idx + "</td>" +
    "<td>" + form + "</td>" +
    "<td>" + data.result + "</td>" +
    "<td><button class='ul icon button' id='remove_btn'><i class='trash alternate icon'></i></button></td>" +
    "</tr>"
  $("tbody").append(template)
}

and

function minuscal(data) {
  var idx = index++
    var form = parseInt($("#minusstr1").val()) + $("#minus_op").text() + parseInt($("#minusstr2").val())
  var cal = parseInt($("#minusstr1").val()) - parseInt($("#minusstr2").val())

  var template = "<tr>" +
    "<td>" + idx + "</td>" +
    "<td>" + form + "</td>" +
    "<td>" + data.result + "</td>" +
    "<td><button class='ul icon button' id='remove_btn'><i class='trash alternate icon'></i></button></td>" +
    "</tr>"
  $("tbody").append(template)
}

Upvotes: -1

Views: 74

Answers (3)

Kiran Shahi
Kiran Shahi

Reputation: 7980

Simply separate the logic related to template. Here I have organized it in one function. And I have merged pluscal and minuscal function.

function cal(data, calType) { 
   // calType need to be either plus or minus
   var idx = index++ 
   var form = parseInt($(`#${calType}str1`).val()) + $(`#${calType}_op`).text() + parseInt($(`#${calType}str2`).val()) 
   var cal = parseInt($(`#${calType}str1`).val()) + parseInt($(`#${calType}str2`).val()) 
   generateTemplate(idx, form, cal, data);
}

function generateTemplate(idx, form, cal, data) {
   var template = `<tr>
   <td> ${idx} </td>
   <td> ${form} </td>
   <td> ${data.result} </td>
   <td><button class='ul icon button' id='remove_btn'><i class='trash alternate icon'></i></button></td>
   </tr>`
   $("tbody").append(template) 
}

Upvotes: 2

Charles DOUKOURE
Charles DOUKOURE

Reputation: 161

try this

function multiCase(caseType, data) {
    if (caseType === 'Maj') {
        str1 = "#plusstr1",
        str2 = "#plusstr2",
        op = "#plus_op"
    } else {
        str1 = "#minusstr1",
        str2 = "#minusstr2",
        op = "#minus_op"
    }
    var idx = index++ 
    var form = parseInt($(str1).val()) + $(op).text() + parseInt($(str2).val()) 
    var cal = parseInt($(str1).val()) + parseInt($(str2).val()) 
    /* And other part of your function 
    ...
    ...
    */

Hope it helps

Upvotes: 1

farkasnorbert90
farkasnorbert90

Reputation: 41

Create another function what returns the template

function getTemplate(idx, form, result) {
    return "<tr>" +
               "<td>" + idx + "</td>" +
               "<td>" + form + "</td>" +
               "<td>" + result + "</td>" +
               "<td><button class='ul icon button' id='remove_btn'><i class='trash alternate icon'></i></button></td>" +
           "</tr>";
}

So then you can use like this

function pluscal(data) {
    var idx = index++ 
    var form = parseInt($("#plusstr1").val()) + $("#plus_op").text() + parseInt($("#plusstr2").val()) 
    var cal = parseInt($("#plusstr1").val()) + parseInt($("#plusstr2").val()) 
    var template = getTemplate(idx, form, data.result);
    $("tbody").append(template)
}

Upvotes: 1

Related Questions