Change value of textbox when radio/check value is changed

by chayacooper

HTML

<input type=radio name=radio_value value=1>1
<input type=radio name=radio_value value=2>2
<input type=radio name=radio_value value=3>3
<input type=radio name=radio_value value=4>4
<input type=radio name=radio_value value=5>5
<input type=text name=text_value value=Default>
<div id="slider" class="selector" style="margin-top: 50px"></div>
<button onclick="window.alert($('#slider').slider( " values " ));"

CSS

#min_price {
    float: left;
    font-size:7.5pt;
    position: relative;
    top: 5px;
    left:1px;
    text-align:left;
    width: 15px
}
#max_price {
    float: left;
    font-size:7.5pt;
    position: relative;
    top: 5px;
    left:82px;
    text-align:right
}
#min_price_range, #max_price_range {
    width: 50px;
    font-size: 7pt
}
.ui-slider .ui-slider-handle {
    width: .55em;
    height: .6em;
}
.ui-slider .ui-slider-range {
    font-size: 8pt
}
.ui-slider-horizontal {
    height: .2em;
    width: 120px;
}
.ui-slider-horizontal .ui-slider-handle {
    top: -.25em;
    margin-left: 0em;
}
.ui-slider-horizontal .ui-slider-range {
    top: 0;
    height: 100%;
}

JavaScript

// By Name Attribute
$('input[name="radio_value"]').change(function () {
    $('input[name="text_value"]').val($('input:radio[name=radio_value]:checked').val());
});


//$('.change2').val( $('.change1').val() );



$(".selector").slider({
    change: function (event, ui) {
        var values = $(".selector").slider("values");
        //alert($('.selector').slider( "values" ));

    }
});

//$('input[name="text_value"]').val( $( "#slider" ).slider( "values" ) ); 
//$( "#slider" ).slider( "values" );    



//$( "#slider" ).slider({ });
//change: function( event, ui ) {
//$('input[name="text_value"]').val( $(sliderValue).val() ); 
//alert (sliderValue);
//}