फ्रंट एंड में रेडियोबटन बनाना (PHP)

पहला समाधान:

आप अपनी वर्तमान स्थिति के साथ क्या कर सकते हैं, अपने onclick के फ़ंक्शन के अंदर आवश्यक पैरामीटर डालना है टैग।

onclick="javascript:createRadioElement('new option', 'checked');"

समस्या:

लेकिन समस्या यह है कि आप पहले पैरामीटर में क्या हार्ड-कोड करते हैं, इसके आधार पर नया विकल्प ठीक हो जाएगा।

नया समाधान:

आप क्या कर सकते हैं, अपने बटन के ठीक पहले एक टेक्स्ट बॉक्स जोड़ना है, ताकि आप उपयोगकर्ता को उनके पसंदीदा विकल्प को इनपुट करने का मौका दे सकें।

<div id="option-div"></div> <!-- THIS IS WHERE THE NEW RADIO BUTTONS WILL BE PUT -->
<input type="text" id="new-option" placeholder="Insert New Option">
<input type="button" id="create" value="Create New Equipment">

फिर, एक स्क्रिप्ट बनाएं जो उपयोगकर्ता के इनपुट टेक्स्ट के साथ एक नया रेडियो बटन बनाएगी:

var optiondiv = document.getElementById('option-div'); /* GET THE DIV ELEMENT OF WHERE WE WILL PUT THE RADIO BUTTONS */

document.getElementById('create').onclick = function () { /* WHEN CREATE NEW EQUIPMENT BUTTON IS CLICKED */

    var input = document.createElement('input'), /* CREATE NEW INPUT ELEMENT */
        newopt = document.getElementById('new-option').value; /* GET THE INPUT OF THE USER */
        label = document.createElement('label'); /* CREATE A NEW LABEL ELEMENT */

    /* IF USER DID NOT INPUT A TEXT, 'No Entered Text' WILL BE THE DEFAULT VALUE */
    newopt = (newopt == '')?'No Entered Text':newopt;

    /* FILL OUT THE TAGS OF THE NEW INPUT ELEMENT */
    input.type = "radio";
    input.setAttribute("value", newopt);
    input.setAttribute("checked", true);
    input.setAttribute("name", "radio-name");

    /* PUT THE INPUT ELEMENT/RADIO BUTTON INSIDE THE LABEL */
    label.appendChild(input);
    label.innerHTML += newopt+'<br>';

    /* PUT THE LABEL ELEMENT INSIDE THE option-div DIV */
    optiondiv.appendChild(label);

    document.getElementById('new-option').value = ''; /* RESET THE TEXT FIELD */

};

आप इसे fiddle देख सकते हैं उदाहरण के लिए।

असली समस्या:

आप नए जोड़े गए रेडियो बटन को स्थायी रूप से संग्रहीत करना चाहते हैं, लेकिन आपने पहले Javascript का सहारा लिया है।

समाधान:

नए जोड़े गए रेडियो बटन को स्थायी रूप से स्टोर करने के लिए, आप इसे अपने डेटाबेस में स्टोर कर सकते हैं। आपको एक डेटाबेस तैयार करना होगा जो आपके फॉर्म को गतिशील बनाएगा।

एक टेबल बनाएं, मान लें कि radio_tb :

radio_id | name |
---------+------+
    1    | opt1 |
    2    | opt2 |
    3    | opt3 |

फिर, उन्हें रेडियो बटन के रूप में प्रदर्शित करने का प्रयास करें:

/* ASSUMING YOU ESTABLISH YOUR CONNECTION TO $connection VARIABLE */
$stmt = $connection->prepare("SELECT radio_id, name FROM radio_tb");
$stmt->execute();
$stmt->bind_result($radioid, $name);
while($stmt->fetch()){
    echo '<label><input type="radio" name="equip" value="'.$radioid.'">'.$name.'</label>';
}
$stmt->close();

आप नया रेडियो बटन डालने के लिए मेरे द्वारा प्रदान की गई स्क्रिप्ट का उपयोग जारी रख सकते हैं, लेकिन आपको Ajax<का उपयोग करना होगा। /ए> उन नए जोड़े गए विकल्पों को अपने डेटाबेस में सम्मिलित करने के लिए।