Tabulation with jquery

Asked

Viewed 34 times

2

How do I tabulate a sentence and put one under the other ? Let me explain to you: I’m using this code to add inside a div:

<script type="text/javascript">
$(document).ready(function() {

  $('#cbo_vitrine').change(function(){ 

  itemsel = $("#cbo_vitrine option:selected").text();

           if(itemsel == "REF-01")

                $("#det_prod_vitrine").append("FLOR BATIDO - MARROM - Nº: 23 ao 41 - R$34,99");

           if(itemsel == "REF-02")

                $("#det_prod_vitrine").append("MEDALHÃO - MARROM - Nº: 33 ao 44 - R$34,99");

           //if(itemsel == "REF-...")       
   });  
});
</script>

I select it in a select and add it with append. Only it’s getting a little bumpy. Detail: I’m not bringing anything database and yes it’s static. Someone suggest something more practical or guide me to tabulate ?? Grateful teachers.

html

1 answer

0


You can include the phrase in a div, for example, because the div occupies the entire width of the line making each sentence a single line:

$(document).ready(function() {

  $('#cbo_vitrine').change(function(){ 

  itemsel = $("#cbo_vitrine option:selected").text();

           if(itemsel == "REF-01")

                $("#det_prod_vitrine").append("<div>FLOR BATIDO - MARROM - Nº: 23 ao 41 - R$34,99</div>");

           if(itemsel == "REF-02")

                $("#det_prod_vitrine").append("<div>MEDALHÃO - MARROM - Nº: 33 ao 44 - R$34,99</div>");

           //if(itemsel == "REF-...")       
   });  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="cbo_vitrine">
   <option>REF-01</option>
   <option>REF-02</option>
</select>
<div id="det_prod_vitrine"></div>

Or break the line with a <br> at the end of the sentence:

$(document).ready(function() {

  $('#cbo_vitrine').change(function(){ 

  itemsel = $("#cbo_vitrine option:selected").text();

           if(itemsel == "REF-01")

                $("#det_prod_vitrine").append("FLOR BATIDO - MARROM - Nº: 23 ao 41 - R$34,99<br>");

           if(itemsel == "REF-02")

                $("#det_prod_vitrine").append("MEDALHÃO - MARROM - Nº: 33 ao 44 - R$34,99<br>");

           //if(itemsel == "REF-...")       
   });  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="cbo_vitrine">
   <option>REF-01</option>
   <option>REF-02</option>
</select>
<div id="det_prod_vitrine"></div>

Browser other questions tagged html

You are not signed in. Login or sign up in order to post.