CODEWITHSUNDEEP
phpjqueryhtml
appaloosa
appaloosa

Reputation: 29

Display the result of a JQuery form in a div

I'm making a calculator via a Jquery form and I'd like to display the result in a div but I can not find any solution to do it, someone would have a solution? For the moment I use inputs to display the results.

$(document).ready(function() {
      $("form#formulaire_calcul_pack").submit(function() {
           $.getJSON("wp-content/mu-plugins/calc-agri/controleur.php",
           {"actionReapro" : "calculer",
            "nombre_conso_vl_pack" : $("input#nombre_conso_vl_pack").val(),
            "nombre_jour" : $("input#nombre_jour").val(),
            "nombre_date_pack" : $("input#nombre_date_pack").val(),
            "nombre_vache" : $("input#nombre_vache").val() },
            function(data) {
                $("input#resultat_jour").val(data['resultat_jour']);
                $("input#resultat_pack_litre").val(data['resultat_pack_litre']);
                $("input#resultat_gobelet").val(data['resultat_gobelet']);
                $("input#resultat_besoin").val(data['resultat_besoin']);
            }
           );
           return false;
    });
});
<p><i class="fa fa-tint" aria-hidden="true"></i> Je dois commander :
        <input id="resultat_pack_litre" type="text" readonly="readonly"/>
</p>   
<p><i class="fa fa-tint" aria-hidden="true"></i> Soit :
        <input id="resultat_besoin" type="text" readonly="readonly"/>
</p>
<p><i class="fa fa-tint" aria-hidden="true"></i> Soit l'&eacute;quivalent de :
        <input id="resultat_gobelet" type="text" readonly="readonly"/>
</p>

Upvotes: 0

Views: 66

Answers (2)

Cyril Beeckman
Cyril Beeckman

Reputation: 1278

You can make it with .html() or .text() if you dont want to include html

Like this : 

$(".myDiv").html(data['resultat_jour']);
$(".myDiv").text(data['resultat_jour']);

Upvotes: 0

St&#233;phane Ammar
St&#233;phane Ammar

Reputation: 1454

Please ask in English

Use jquery text function.

JS: 

$(document).ready(function() {
      $("form#formulaire_calcul_pack").submit(function() {
           $.getJSON("wp-content/mu-plugins/calc-agri/controleur.php",
           {"actionReapro" : "calculer",
            "nombre_conso_vl_pack" : $("input#nombre_conso_vl_pack").val(),
            "nombre_jour" : $("input#nombre_jour").val(),
            "nombre_date_pack" : $("input#nombre_date_pack").val(),
            "nombre_vache" : $("input#nombre_vache").val() },
            function(data) {
                $("div#resultat_jour").text(data['resultat_jour']);
                $("div#resultat_pack_litre").text(data['resultat_pack_litre']);
                $("div#resultat_gobelet").text(data['resultat_gobelet']);
                $("div#resultat_besoin").text(data['resultat_besoin']);
            }
           );
           return false;
    });
});

HTML : 

<p><i class="fa fa-tint" aria-hidden="true"></i> Je dois commander :
    <div id="resultat_pack_litre"></div>
</p>   
<p><i class="fa fa-tint" aria-hidden="true"></i> Soit :
    <divid="resultat_besoin"></div>
</p>
<p><i class="fa fa-tint" aria-hidden="true"></i> Soit l'&eacute;quivalent de :
    <div id="resultat_gobelet"></div>
</p>

Upvotes: 1

Related Questions