2016-04-13 9 views
0

Ich suchte um ein paar verschiedene Orte nach einer Antwort und überprüfte Themen like this, aber war nicht in der Lage, eine anwendbare Antwort zu finden.ASP.NET: Ja/Nein Optionsfelder, Wenn Ja, TextBox aktivieren?

Ich erstelle eine Webanwendung für ein Papierformular (ähnlich wie der Benutzer in dem Link, den ich gepostet habe). Im Gegensatz zu diesem Benutzer verwende ich jedoch kein Update-Panel für das Display. Sein Beitrag war nicht beschreibend genug, um herauszufinden, wie er replizieren konnte, was er getan hatte, um es zum Laufen zu bringen.

Alles, was ich tun möchte, ist eine asp RadioButtonList; Wenn "Ja" aktiviert ist, aktivieren Sie "Reported Date" (siehe unten, wie es derzeit auf dem Formular aussieht); "Else" deaktiviere es.

enter image description here

<div class="col-xs-6 text-right"> 
         <b>Reported to a Supervisor?</b><br> 
        </div> 
        <asp:RadioButtonList ID="RadioButtonList_ReportedToSupervisor" runat="server" 
         RepeatDirection="Horizontal"> 
         <asp:ListItem Text="Yes" Value="1"></asp:ListItem> 
         <asp:ListItem Text="No" Value="0"></asp:ListItem> 
        </asp:RadioButtonList> 
        <br> 
        <div class="col-xs-6 text-right"> 
         <b>Reported Date:</b><br> 
        </div> 
        <div class="col-xs-6"> 
         <asp:TextBox 
          runat="server" 
          ID="TextBox_ReportedDate" 
          class="form-control" 
          style="max-width:125px" /> 
         <asp:RegularExpressionValidator 
          ID="RegularExpressionValidator_ReportedDate" 
          runat="server" 
          ControlToValidate="TextBox_ReportedDate" 
          ErrorMessage="Invalid date" 
          ValidationExpression="^^((0[1-9])|(1[0-2]))\/((0[1-9])|(1[0-9])|(2[0-9])|(3[0-1]))\/(\d{4})$" 
          Display="Dynamic" 
          SetFocusOnError="True" 
          Font-Bold="true" 
          ForeColor="red" /> 
         <ajaxToolkit:MaskedEditExtender ID="maskededitextender_ReportedDate" runat="server" TargetControlID="TextBox_ReportedDate" Mask="99/99/9999" MaskType="Date" AcceptNegative="None" /> 
        </div> 

Ich bin auf die Erstellung von Web-Anwendungen sehr neu, so dass ich, wenn es sich um eine relativ dumme Frage entschuldigen. Ich kenne die üblichen ASP.NET-Steuerelemente nicht genug, um das herauszufinden.

Vielen Dank!

Antwort

0

Setzen Sie die OnTextChanged-Eigenschaft Ihrer RadioButtonList auf den Namen einer Methode (die Sie erstellen) und die AutoPostBack-Eigenschaft auf true. Setzen Sie die Enabled-Eigenschaft Ihres TextBox auf false. Dann in der Methode, die Sie erstellen. Stellen Sie die TextBox aktiviert:

protected void EnableTextBox(object sender, EventArgs e) 
    { 
         TextBox_ReportedDate.Disabled = false;  } 

Oder Sie dies in Javascript tun. In der Pageload() -Methode, die Onchange Eigenschaft der Radiobuttonlist auf eine JavaScript-Funktion gesetzt werden Sie schreiben:

RadioButtonList_ReportedToSupervisor.Add("onchange", "EnableTextBox('" + TextBox_ReportedDate.ClientID + "');"); 

diese Dann fügen Sie Javascript-Funktion zu Ihrer aspx Seite:

<script language="javascript" type="text/javascript"> 
function EnableTextBox(RBLID) 
{ 
    var textbox = document.getElementById(RBLID); 
    textbox.disabled = false; 
} 

0

Versuchen Sie diese.

$('#RadioButtonList_ReportedToSupervisor input').change(function() { 
var selectedvalue = $(this).val(); 
if (selectedvalue === "1") 
{ 
    $("#TextBox_ReportedDate").attr('disabled', 'disabled'); 

} 
else if (selectedvalue === "0") { 
    $("#TextBox_ReportedDate").removeAttr('disabled'); 
} 
}); 
+0

Es funktioniert, aber Sie Anzeigen/Verbergen des TextBox statt zu aktivieren/deaktivieren es (Siehe: http://stackoverflow.com/questions/ 1414365/disable-enable-an-input-with-jquery). – ConnorsFan

0

try this:

$("input[name=toggle]").on('click', function() { var checked = $("input[name=toggle]").prop('checked'); 
 
console.log(checked); 
 
    if(checked) { $("#yourbtnId").show(); } 
 
    else { $("#yourbtnId").hide(); } 
 
               });
<input type="radio" name="toggle" value="1">Toggle

Verwandte Themen