Wie setze/setze ich die Dialog-Optionsfeldgruppe?

Ich versuche, ein Skript zu schreiben, wo ich einige Parameter einstellen könnte, bevor ich den Dialog aufrufen kann. Es gibt nur eine Schaltfläche, OK und Radiobutton-Gruppe. Ich plante, den Titel des Dialogs vor dem Anruf zu ändern und auch frei (grammatikalisch) festzulegen, welcher Radiobutton aktiviert ist. Erster Aufruf, nach dem Laden des Skripts, zeige den Dialog ohne Radiobutton an, aber wenn ich einen von ihnen überprüfe und dann den Anruf wiederhole (zum Beispiel die Taste drücken) erscheint der Dialog mit dem vorher ausgewählten Radiobutton aber der zurückgegebene Wert ist "undefiniert" . Ich brauche dies:
Wie setze/setze ich die Dialog-Optionsfeldgruppe?

Ich wünsche nehmen Sie eine Auswahlknöpfe in Dialog zu prüfen programmaticaly vor Aufruf, sie zu öffnen
Ich wünsche der Lage sein, Radiobuttons zurücksetzen (überprüft keine), wenn einer von ihnen früher geprüft

habe ich versucht, eine Lösung, die ich hier und da, aber keine Punkte gefunden.

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <link rel="stylesheet" href="//resources/demos/style.css"> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
<script> 
$("#dialog-oc").dialog({ 
     modal: true, 
     width: 520, 
     resizable:false, 
     autoOpen: false, 
     buttons: { 
     Ok: function() { 
      var odg=$('input[name="radiooc"]:checked', '#dialog-oc').val(); 
      $('#dialog-oc input:radio:checked').each(function() { 
       $(this).attr('checked', false); 
      }); 
      $("#dialog-oc").dialog("close"); //close dialog 
      alert('Answer is '+odg); 
     } 
     } 
    }); 
}); 

//open dialog 
$("#dialog-oc").dialog("open"); 
$('#dialog-oc input:radio').prop('checked', false); //reset radiobuttons 
$(".second").attr('checked', false); //reset by using class 
//change title of dialog, this works OK: 
$("#dialog-oc").dialog("option", "title", "New title"); 

$(function() { 
    $("input").checkboxradio(); 
    $("fieldset").controlgroup(); 
}); 
</script> 

<body> 
<div class="widget" id="dialog-oc" title="Pick a one"> 
    <fieldset> 
    <legend>Pick quantity: </legend> 
    <label for="radio-1">1</label> 
    <input type="radio" name="radiooc" id="radio-1" class="second" value="1"> 
    <label for="radio-2">2</label> 
    <input type="radio" name="radiooc" id="radio-2" class="second" value="2"> 
    <label for="radio-3">3</label> 
    <input type="radio" name="radiooc" id="radio-3" class="second" value="3"> 
    </fieldset> 
</div> 
</body>

Quelle

2017-10-23 Ludus H

Welche Daten müssen Sie ermitteln, welche Radiobuttons beim Öffnen des Dialogs "überprüft" werden sollen? – Twisty

Ich kann lesen, welche Optionsschaltfläche nach Klicken auf OK im Dialogfeld gedrückt wird, aber ich kann keine der Optionsschaltflächen festlegen, bevor ich den Dialog zum Öffnen öffne. Außerdem möchte ich, dass ich alle Radiobuttons nach jedem Aufruf zurücksetzen kann, um den Dialog zu öffnen, so dass es keinen Hinweis darauf gibt, welcher Radiobutton beim letzten Aufruf überprüft wurde ... –

Ok, also beim 1. Durchgang, nein Optionsfelder sollten überprüft werden. Wo werden im 2. Durchgang die Daten gespeichert, die ausgewählt wurden? – Twisty

Ich denke, das könnte helfen; nicht sicher.

Arbeitsbeispiel: https://jsfiddle.net/Twisty/t0a7uabq/

HTML

<button id="sel-btn">Select</button> 
<div id="dialog-oc" title="Pick a one"> 
    <fieldset> 
    <legend>Pick quantity: </legend> 
    <label for="radio-1">1</label> 
    <input type="radio" name="radiooc" id="radio-1" class="second" value="1"> 
    <label for="radio-2">2</label> 
    <input type="radio" name="radiooc" id="radio-2" class="second" value="2"> 
    <label for="radio-3">3</label> 
    <input type="radio" name="radiooc" id="radio-3" class="second" value="3"> 
    </fieldset> 
</div>

JavaScript

$(function() { 
    $("#dialog-oc").dialog({ 
    modal: true, 
    width: 520, 
    resizable: false, 
    autoOpen: false, 
    buttons: { 
     Ok: function() { 
     var odg = $('#dialog-oc input:checked').val(); 
     $("#sel-btn").data("sel", $('#dialog-oc input:checked').attr("id")); 
     $('#dialog-oc input:radio').each(function() { 
      $(this).prop('checked', false); 
     }); 
     $("#dialog-oc").dialog("close"); //close dialog 
     } 
    }, 
    open: function(e, ui) { 
     if ($('#sel-btn').data("sel") !== null) { 
     var mySel = $('#sel-btn').data("sel"); 
     $("#" + mySel).prop("checked", true); 
     } 
    } 
    }); 

    //open dialog 
    $("#dialog-oc").dialog("open"); 
    $("#sel-btn").click(function() { 
    $("#dialog-oc").dialog("open"); 
    }) 
    $('#dialog-oc input:radio').prop('checked', false); //reset radiobuttons 
    $(".second").attr('checked', false); //reset by using class 
    //change title of dialog, this works OK: 
    $("#dialog-oc").dialog("option", "title", "New title"); 

    $("input").checkboxradio(); 
    $("fieldset").controlgroup(); 
});

Sie können den open Rückruf machen, um Code auszuführen, die ein Optionsfeld einstellen können checked. Ich habe das Feature .data() verwendet, um die ausgewählte ID zu speichern, wenn das Dialogfeld geschlossen wird. Auf diese Weise wird das gleiche Element beim Öffnen aktiviert.

Quelle

2017-10-23 21:46:09 Twisty

HEy Kumpel, ich habe dein Beispiel versucht, aber es hilft mir nicht, aber danke für deine Mühe zu helfen. –

@LudusH was genau funktioniert nicht? Oder ist dein Beispiel nicht wie dein Code? Irgendwelche Fehler in der Konsole? – Twisty

alles ist in Ordnung, ich habe einen kleinen, kaum sichtbaren Fehler gemacht, indem ich den Code übernommen habe, aber nach der Überarbeitung ist es jetzt in Ordnung. Vielen Dank. –

Wie setze/setze ich die Dialog-Optionsfeldgruppe?

Antwort

Verwandte Themen