Pranav Mandlik
Pranav Mandlik

Reputation: 644

giving error on append function missing argument list

I am getting following error when ii try to run the code I know the error is in the append function I don't know how to handle with escape characters

function check()
{
    if(usertype==null)
    {
        alert('please select user type');
    }
    else
    {
        $('#registerusers').hide();
        if(usertype=='individual')
        {
            $('#agent').html();
            $('#vendor').html();
            $('#service').html();
            $('#'+usertype).append('<div class="tab">Name: <p><input placeholder="First name..." oninput="this.className = ''"></p> <p><input placeholder="Last name..." oninput="this.className = ''"></p> </div> <div class="tab">Contact Info: <p><input placeholder="E-mail..." oninput="this.className = ''"></p> <p><input placeholder="Phone..." oninput="this.className = ''"></p> </div> <div class="tab">Birthday: <p><input placeholder="dd" oninput="this.className = ''"></p> <p><input placeholder="mm" oninput="this.className = ''"></p> <p><input placeholder="yyyy" oninput="this.className = ''"></p> </div> <div class="tab">Login Info: <p><input placeholder="Username..." oninput="this.className = ''"></p> <p><input placeholder="Password..." oninput="this.className = ''"></p> </div> <div style="overflow:auto;"> <div style="float:right;"> <button type="button" id="prevBtn" onclick="nextPrev(-1)">Previous</button> <button type="button" id="nextBtn" onclick="nextPrev(1)">Next</button> </div> </div> <!-- Circles which indicates the steps of the form: --> <div style="text-align:center;margin-top:40px;"> <span class="step"></span> <span class="step"></span> <span class="step"></span> <span class="step"></span> </div> ');
            $('#'+usertype).removeClass('hid');
        }
        else if(usertype=='agent')
        {
            $('#individual').html();
            $('#vendor').html();
            $('#service').html();

            $('#'+usertype).html('<h2> as</h2>');
            $('#'+usertype).removeClass('hid');
        }



        alert(usertype);
    }

}

Upvotes: 0

Views: 57

Answers (2)

vikalp
vikalp

Reputation: 330

Try this :

function check()
{
    if(usertype==null)
    {
        alert('please select user type');
    }
    else
    {
        $('#registerusers').hide();
        if(usertype=='individual')
        {   
            $('#agent').html();
            $('#vendor').html();
            $('#service').html();
            $('#'+usertype).append('\
                <div class="tab">\
                    Name: <p><input placeholder="First name..." oninput="this.className = '+""+'"></p>\
                    <p><input placeholder="Last name..." oninput="this.className = '+""+'"></p> \
                </div> \
                <div class="tab">\
                    Contact Info: <p><input placeholder="E-mail..." oninput="this.className = '+""+'"></p> \
                    <p><input placeholder="Phone..." oninput="this.className = '+""+'"></p> \
                </div> \
                <div class="tab">\
                    Birthday: <p><input placeholder="dd" oninput="this.className = '+""+'"></p> \
                    <p><input placeholder="mm" oninput="this.className = '+""+'"></p> \
                    <p><input placeholder="yyyy" oninput="this.className = '+""+'"></p>\ 
                </div> \
                <div class="tab">\
                    Login Info: <p><input placeholder="Username..." oninput="this.className = '+""+'"></p> \
                    <p><input placeholder="Password..." oninput="this.className = '+""+'"></p> \
                </div> \
                <div style="overflow:auto;"> \
                    <div style="float:right;"> \
                        <button type="button" id="prevBtn" onclick="nextPrev(-1)">Previous</button> \
                        <button type="button" id="nextBtn" onclick="nextPrev(1)">Next</button> \
                    </div> \
                </div> <!-- Circles which indicates the steps of the form: --> \
                <div style="text-align:center;margin-top:40px;"> \
                    <span class="step"></span> \
                    <span class="step"></span> \
                    <span class="step"></span> \
                    <span class="step"></span> \
                </div> \
            ');
            $('#'+usertype).removeClass('hid');
        }
        else if(usertype=='agent')
        {
            $('#individual').html();
            $('#vendor').html();
            $('#service').html();

            $('#'+usertype).html('<h2> as</h2>');
            $('#'+usertype).removeClass('hid');
        }



        alert(usertype);
    }

}

Upvotes: 1

You have to escape the '' in your code:

Like this: oninput="this.className=\'\'"

Look at the solution below:

var usertype = "individual"
function check() {
  if (usertype == null) {
    alert('please select user type');
  } else {
    $('#registerusers').hide();
    if (usertype == 'individual') {
      $('#agent').html();
      $('#vendor').html();
      $('#service').html();
      $('#' + usertype).append('<div class="tab">Name: <p><input placeholder="First name..." oninput="this.className=\'\'"></p><p><input placeholder="Last name..." oninput="this.className=\'\'"></p> </div> <div class="tab">Contact Info: <p><input placeholder="E-mail..." oninput="this.className=\'\'"></p> <p><input placeholder="Phone..." oninput="this.className=\'\'"></p> </div> <div class="tab">Birthday: <p><input placeholder="dd" oninput="this.className=\'\'"></p> <p><input placeholder="mm" oninput="this.className="></p> <p><input placeholder="yyyy" oninput="this.className=\'\'"></p> </div> <div class="tab">Login Info: <p><input placeholder="Username..." oninput="this.className=\'\'"></p> <p><input placeholder="Password..." oninput="this.className=\'\'"></p> </div> <div style="overflow:auto;"> <div style="float:right;"> <button type="button" id="prevBtn" onclick="nextPrev(-1)">Previous</button> <button type="button" id="nextBtn" onclick="nextPrev(1)">Next</button> </div> </div> <!-- Circles which indicates the steps of the form: --> <div style="text-align:center;margin-top:40px;"> <span class="step"></span> <span class="step"></span> <span class="step"></span> <span class="step"></span> </div> ');
      $('#' + usertype).removeClass('hid');
    } else if (usertype == 'agent') {
      $('#individual').html();
      $('#vendor').html();
      $('#service').html();

      $('#' + usertype).html('<h2> as</h2>');
      $('#' + usertype).removeClass('hid');
    }
    alert(usertype);
  }

}

check()
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="individual"></div>

Upvotes: 1

Related Questions