Reputation: 41
I have a form with two hidden fields that appear based on an answer to a previous input. I'm having no problem getting these to appear with some JavaScript. However, I'm unable to get the values of my radio buttons inserted onto the page. The following code:
<div id="hidden-fields" style="display:none">
<div class="sixteen columns input-wrap">
<input id="delivery-instructions" name="ship_delivery_instructions" type="text" placeholder="Special delivery instructions?">
</div>
<div class="sixteen columns input-wrap">
<label>Preferred dropoff time
<input type="radio" class="radio-button" name="ship_dropoff_time" value="1">1 - 3 PM
<input type="radio" class="radio-button" name="ship_dropoff_time" value="6">6 - 8 PM
</label>
</div>
</div>
</div>
Results in these inputs:
<input type="radio" class="radio-button" name="ship_dropoff_time" value>
<input type="radio" class="radio-button" name="ship_dropoff_time" value>
Anybody have an idea as to why my radio button values are disappearing?
EDIT: Here is the CoffeeScript used to display the fields.
events:
"keyup #zip": "check_zip_code"
check_zip_code: (e) ->
currentZip = e.currentTarget.value
if eligibleZipCodes.indexOf(currentZip) == -1
@makeFieldsInvis()
else
@makeFieldsVis()
makeFieldsInvis: ->
$("#hidden-fields").css("display", "none")
$("#delivery-instructions").val("")
$(".radio-button").each(-> $(this).attr('checked', false))
makeFieldsVis: ->
$("#hidden-fields").css("display", "block")
Upvotes: 0
Views: 736
Reputation: 105
I believe I have found a solution:
Here is my JSFiddle: http://jsfiddle.net/pmbbLkzk/
Try adding a closing input tag, or self close the input tag:
<input [ATTRIBUTES] ></input>
<input [ATTRBITUES] />
Upvotes: 1