CODEWITHSUNDEEP
jqueryhtml
user2721624
user2721624

Reputation: 43

Saving textbox values corresponding to dropdown selection

I have dropdown box in which i am selecting a value and entering the values in textboxes(For example: i selected 2nd floor and entering respective values in 3 textboxes and again 3rd floor and respective values and so on,finally both should get append.Luckily i am getting this).But the problem is whenever i change the textbox values it should overwrite to the same dropdown values but it is saving previous and present values of textbox(Example: If i select 5th flooor and write values in textboxes and if i change it again it is not overwriting instead of this its saving twice with same values). Please help me in resolving the issue. http://jsfiddle.net/ztord9py/13/

var areaoffered=[];     
     var floor=[];
     var timeline=[];
     var floorss;

     $("#floor").change(function(){
         floorss =  $("#floor").val(); 
     });  

        $("#areaoffered").change(function(){
        var areamax = $("#areaoffered").val(); 
        var areamin = (floorss+"-"+areamax);  
        areaoffered.push(areamin);

        });  

        $("#components").change(function(){
           var componentsmax = $("#components").val(); 
           var componentsmin = (floorss+"-"+componentsmax);  
            floor.push(componentsmin);

         });    

       $("#timeline").change(function(){
           var timelinemax = $("#timeline").val(); 
           var timelinemin = (floorss+"-"+timelinemax);  
           timeline.push(timelinemin);

         });

$("#submitt").click(function(){
    alert(areaoffered);
});

<select   id="floor" >
    <option value="1st floor">1st floor </option>
    <option value="2nd floor">2nd floor</option>
    <option value="3rd floor">3rd floor</option>
    <option value="4th floor">4th floor</option>
    <option value="5th floor">5th floor</option>
</select></br>
<input type="text" id="areaoffered"   /></br>
<input type="text"  id="components"   /></br>
<input type="text"  id="timeline"   /></br>
<input   type="button" value="Submit" id="submitt" />

Upvotes: 0

Views: 160

Answers (3)

user2721624
user2721624

Reputation: 43

Myself found an answer

 var floors = [];
var timelines=[];
var areas=[];
 var components = [];


 $("#floor").change(function(){
    $("#areaoffered").val(areas[$("#floor").val()]); 
    $("#components").val(components[$("#floor").val()]); 
    $("#timeline").val(timelines[$("#floor").val()]); 

 });  

    $("#areaoffered").change(function(){
    var areaOffered = $("#areaoffered").val();
    areas[$("#floor").val()] = areaOffered;
    }); 


    $("#components").change(function(){
       var componentsmax = $("#components").val(); 
       components[$("#floor").val()] = componentsmax ;
    });     

   $("#timeline").change(function(){
       var timelinemax = $("#timeline").val(); 
       timelines[$("#floor").val()]=timelinemax;
     });     


$("#submitt").click(function(){
var finalDetails = [];
    for(var i=1;i<16;i++)
    {
        if(areas[i]!=undefined)
            finalDetails.push('floor:'+i+'      areaOffered:'+areas[i]+'    components:'+components[i]);
    }
     alert(finalDetails);
});

Upvotes: 0

alamnaryab
alamnaryab

Reputation: 1484

replace line inside $("#floor").change();

var floorss={};
$("#floor").change(function(){
     floorss[$("#floor").val()] =  $("#floor").val(); 
 });

Upvotes: 1

Tariq hussain
Tariq hussain

Reputation: 614

clear the value of var areaoffered after alert ..

Upvotes: 0

Related Questions