CODEWITHSUNDEEP
jqueryformstwitter-bootstrap
Daniele Martini
Daniele Martini

Reputation: 143

Jquery save input val to a label when button pressed

Good morning everyone. I'm making a very long form using bootstrap, and jquery. I'm having problems with the last section where I should see a general review of the form which has been filled. Here is a small example of the form

$('button').on('click', function() {

  var nomesalone = $('#nomeSaloneInput').val();
  $('#defNomeSalone').append(nomesalone);

  var indirizzo = $('#indirizzoInput').val();
  $('#defNomeSalone').append(indirizzo);

  var cap = $('#capInput').val();
  $('#defNomeSalone').append(cap);

  var citta = $('#cittaInput').val();
  $('#defNomeSalone').append(citta);

  var provincia = $('#provinciaInput').val();
  $('#defNomeSalone').append(provincia);

});

Fiddle Demo enter code here

What I'm trying to do is to save every input val inside the label at the bottom of the page, and every label should be saved when I click the OK button close to the input. I tried several code. Can someone help me?

Upvotes: 0

Views: 173

Answers (3)

Parth Patel
Parth Patel

Reputation: 521

use this.

$('button').on('click', function() {
    var nomesalone = $('#nomeSaloneInput').val();
    var indirizzo = $('#indirizzoInput').val();
    var cap = $('#capInput').val();
    var citta = $('#cittaInput').val();
    var provincia = $('#provinciaInput').val();
    $('#defNomeSalone').text(nomesalone+' '+indirizzo+' '+cap+' '+citta+' '+provincia);
});

Upvotes: 1

A.Sharma
A.Sharma

Reputation: 2799

Your fiddle didn't have JQuery specified as a resource. Be careful with that when posting to SO. In addition, append will not rewrite the element. It will do exactly that: append to it.

Also, you were assigning this text to the same label element (#defNomeSalone) instead of different ones.

Change append to text and differentiate each label element when assigning text to it: http://jsfiddle.net/91nwfb83/15/

Example: 

$('#defNomeSalone').text(nomesalone);

Upvotes: 2

Kevin Grosgojat
Kevin Grosgojat

Reputation: 1379

I edited your fiddle, he's working now. JQuery import was missing.

Make sure you import jquery in your HTML template.

Upvotes: 1

Related Questions