-1

The below code is for creating checkbox dynamically.

But in Chrome console it says $ is not defined. This $ error is in this line:

$.post(
            "index1.php", 
            { 
                "newopt": newopt  
            }, 

Full Code here...

var optiondiv = document.getElementById('option-div');

document.getElementById('create').onclick = function () {

    newopt = document.getElementById('new-option').value;
    if(newopt){
        var input = document.createElement('input'),
        label = document.createElement('label');
         /* 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 = "checkbox";
        input.setAttribute("value", newopt);
        input.setAttribute("checked", true);
        input.setAttribute("name", "prints[]");
        /* 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);
        //optiondiv.appendChild(input);
        //ele.appendChild(input);
        //input.onclick = function(){ alert('this is test'); };

        //optiondiv.appendChild(label);
        document.getElementById('new-option').value = '';

        $.post(
            "index1.php", 
            { 
                "newopt": newopt  
            }, 
            function(data) {
                if(data.success){
                    alert('Successfully Added To dB');
                }else{
                    alert('Not Added To DB');
                }

        });

    }else{
        alert('Please Enter Check Box Value.');
        return false;
    }



};
jeroen
  • 91,079
  • 21
  • 114
  • 132

1 Answers1

0

To use jQuery in your own JavaScript you need to ensure the <script> element that includes jQuery before your own JavaScript (whether inline or included).

(Strictly speaking, be delaying execution you can be less strict, but start with the simple approach.)

Eg. this will work:

<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
<script type='text/JavaScript'>
  // Your code using jQUery
</script>

but this will not:

<script type='text/JavaScript'>
  // Your code using jQUery
</script>
<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
Richard
  • 106,783
  • 21
  • 203
  • 265