开发者

Auto populate text box when Check box id checked - Jquery

I working to put functionality for a check box. When the check box is checked I would like to auto populate the text box with yes. But I couldn't able to get the functionality. Any insights is highly appreciated. Below is code I tried to work with

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
        </script>
        <script language="JavaScript">
        $(document).ready(function() 
        {    
      $('#checkboxid').attr('checked', true) {
            $("input[Title='Text Box Name']").val("Yes");    }

        });
        </script>

Below is the HTML code for those two items. Please bare with my HTML code, it is auto generated code for Sharepoint.

For Text Box and Check Box

<TR><TD nowrap="true" valign="top" width="190px" class="ms-formlabel">
<H3 class="ms-standardheader">
            <nobr>Text Box name</nobr>
        </H3></TD><TD valign="top" class="ms-formbody" width="400px">
    <div align="left" class="ms-formfieldcon开发者_如何学Pythontainer">
<div class="ms-formfieldlabelcontainer" nowrap="nowrap">
<span class="ms-formfieldlabel" nowrap="nowrap">Text Box name</span></div>
<div class="ms-formfieldvaluecontainer"><span dir="none">
<input name="ctl00$m$g_89e4bf6d_529c_49e0_95e0_7024e4172c50$ctl00$ctl04$ctl63$ctl00$ctl00$ctl04$ctl00$ctl00$TextField" type="text" maxlength="255"
id="ctl00_m_g_89e4bf6d_529c_49e0_95e0_7024e4172c50_ctl00_ctl04_ctl63_ctl00_ctl00_ctl04_ctl00_ctl00_TextField" 
title="Text Box name" class="ms-long" /><br></span></div></div></TD></TR>

<TR><TD nowrap="true" valign="top" width="190px" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>Check Box name</nobr>
    </H3></TD>
        <TD valign="top" class="ms-formbody" width="400px">
        <div align="left" class="ms-formfieldcontainer">
        <div class="ms-formfieldlabelcontainer" nowrap="nowrap">
        <span class="ms-formfieldlabel" nowrap="nowrap">Check Box name</span></div>
        <div class="ms-formfieldvaluecontainer"><span dir="none">
        <input id="ctl00_m_g_89e4bf6d_529c_49e0_95e0_7024e4172c50_ctl00_ctl04_ctl60_ctl00_ctl00_ctl04_ctl00_ctl00_BooleanField" 
        type="checkbox" 
        name="ctl00$m$g_89e4bf6d_529c_49e0_95e0_7024e4172c50$ctl00$ctl04$ctl60$ctl00$ctl00$ctl04$ctl00$ctl00$BooleanField" /><br>
    </span></div></div></TD></TR>


$('#checkboxid').attr('checked', true) { $("input[Title='Text Box Name']").val("Yes"); }

This sets the checkbox to checked and adds the value, but doesn't do anything on events.

$('#checkboxid').change(function(){
    $('input[Title='Text Box Name']").val("");
    if ($('#checkboxid').is(':checked')) { 
        $("input[Title='Text Box Name']").val("Yes"); 
    }
});


If you want to check the condition only during page load try this:

$(document).ready(function(){
    if($('#checkboxid').is(':checked')) {
        $("input[Title='Text Box name']").val("Yes");    
    }          
}); 

If you want to check for the condition everytime the checkex is clicked, try this:

$(document).ready(function(){
    $('#checkboxid').click(function(){
            $("input[Title='Text Box name']").val($(this).is(':checked')?"Yes":"");    
    });
}); 


$(function(){
    $('#checkboxId').click(function(e)){
        if($(this).is(':checked')){
            $("input[Title='Text Box Name']").val("Yes");
        }
    }

}

replace checkboxId with the Id of your checkbox.


var textboxid = "#ctl00$m$g_89e4bf6d_529c_49e0_95e0_7024e4172c50$ctl00$ctl04$ctl63$ctl00$ctl00$ctl04$ctl00$ctl00$TextField";
var checkboxid = "#ctl00_m_g_89e4bf6d_529c_49e0_95e0_7024e4172c50_ctl00_ctl04_ctl60_ctl00_ctl00_ctl04_ctl00_ctl00_BooleanField";

$(document).ready(function () {
  $(checkboxid).change(function () {
    if ($(this).prop("checked")) {
      $(textboxid).val("Yes")
    }
  });
  //to trigger the event on load in case the checkbox is checked when the page loads
  $(checkboxid).trigger("change");  
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜