Skip to content Skip to sidebar Skip to footer

Put Value Of Textbox Into Another Textbox

I have a start date which is put in a textbox by the user trough a jquery date picker. I also have an end date textbox which I want to fill with the start date value when the user

Solution 1:

Here is the working code for what you have asked.

<!doctype html><htmllang="en"><head><metacharset="utf-8"><title>jQuery UI Datepicker - Select a Date Range</title><linkrel="stylesheet"href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"><scriptsrc="//code.jquery.com/jquery-1.9.1.js"></script><scriptsrc="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script><script>
            $(function() {
                $("#fromdate").datepicker({
                    onSelect: function() {
                        $(this).change();
                    }
                });
                $("#fromdate").change(function (){
                    var val=$("#fromdate").val();
                    $("#todate").val(val);
                });
            });
        </script></head><body><labelfor="from">From</label><inputtype="text"id="fromdate"name="from"><labelfor="to">to</label><inputtype="text"id="todate"name="to"></body></html>

And working JSFiddle(Here)

Solution 2:

If it is this calendar, (which it looks like from your own "answer"), you could do something like this. It will set "date end" and pop up calendar for it when "date from" is selected:

window.onload = function(){
    var cal_start = newJsDatePick({
        useMode:2,
        target:"date_start",
        dateFormat:"%m/%d/%Y"
    });

    var cal_end = newJsDatePick({
        useMode:2,
        target:"date_end",
        dateFormat:"%m/%d/%Y"
    });
    cal_start.addOnSelectedDelegate(function(){
        document.getElementById('date_end').value = cal_start.getSelectedDayFormatted();
        cal_end.showCalendar();
    });
};

If you do not want the calendar-end to pop up, remove:

cal_end.showCalendar();

Original answer as per your statement "[…] trough a jquery date picker […]" in question text.

jQuery UI variant:

Use onSelect event.

Simple demo:

$(function() {
    $("#date_start").datepicker({
        onSelect: function(d) {
            $("#date_end").val(d);
        }
    });
    $("#date_end").datepicker();
});

You could also add for change event on element, but not sure how user-friendly that would be.

Solution 3:

This is just the simple method below,but if you need something other,let me know

functioncopytextbox()
{
 document.getElementById('textbox2').value=document.getElementById('textbox1').value;

returnfalse;

}

Solution 4:

<script>functionmyfunction()
    {

    document.getElementById("text2").value=document.getElementById("text1").value;
}   
 </script>

and your start date textbox-

<inputtype="text" name="startdate"id="text1" onchange="myfunction()"/>
<inputtype="text" name="enddate"id="text2" />

Post a Comment for "Put Value Of Textbox Into Another Textbox"