How to disable form submit button if the username already exits in database ? (by js, ajax, php(laravel))

Question

I am new js learner, and I am trying to build a form. in the form I want to check if the input username is already taken or exists and I have done this by laravel controller and lil JS code but I want to HIDE the submit button if the input username is already exists in the database. so how do I do this? please anybody

This is my JS code

<script type="">

$function get_user_name(id, result) {
  var id = $(id).val();
  $.get("<?php echo e(url('home/get_user_name')) ?>/" + id,
  function (data) {
    $(result).html(data);
  });
}
</script>

Controller =>

**and 
controller =** 

public function get_user_name()
  {
     $username = request()->segment(3);
    $user = DB::table('users')
    ->select('username')
    ->where('username', $username)
    ->count();

    $nam = "username already taken";

    if ($user >0) {
      return $nam;
    }else{
    }
  }

html form =>

    <span id="username_rs" style="color: green; font-weight: bold"></span>//showing the message here,

<input id="username" name="username"

           onchange="checkem('#username', '#username_rs')" >


<button type="submit" class="btn btn-primary">
            {{ __('Register') }}
          </button>

route =>

Route::get('/home/get_user_name/{username}', 'HomeController@get_user_name')->name('checkun');

And url look like =>

http://localhost/home/get_user_name/{input username}

My code is showing if the username is taken or not, but I want to hide the submit button if the username is taken or exists in the database.

Shivani Sonagara · Accepted Answer · 2019-07-09 11:47:37Z

1

You can return like this:

**and 
controller =** 

public function get_user_name()
  {
     $username = request()->segment(3);
    $user = DB::table('users')
    ->select('username')
    ->where('username', $username)
    ->count();

    if ($user >0) {
      return Response::json(array("found"=>"yes", "message"=>"Username is already taken"));       
    }else{
       return Response::json(array("found"=>"no", "message"=>"Something happens wrong"));
    }
  }

Your Script code looks like:

$function get_user_name(id, result) {
  var id = $(id).val();
  $.get("<?php echo e(url('home/get_user_name')) ?>/" + id,
  function (data) {
     if (data.found == 'yes)
     {
        $("#submit_btn").css("display","none")
     }
  });
}

HTML code looks like:

<span id="username_rs" style="color: green; font-weight: bold"></span>//showing the message here,

<input id="username" name="username"

           onchange="checkem('#username', '#username_rs')" >


<button type="submit" id="submit_btn" class="btn btn-primary">
            {{ __('Register') }}
          </button>

edited Jul 9, 2019 at 11:47

answered Jul 9, 2019 at 11:22

Shivani Sonagara

1,3079 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

ppegu Over a year ago

thanks for the help but its showing controller error => Undefined property: App\Http\Controllers\HomeController::$output ,, How can i use output in the controller?

Shivani Sonagara Over a year ago

I have updated the code. Would you please check it again?

user1630162 Over a year ago

It also help me. Thank you!!

designtocode · Accepted Answer · 2019-07-09 11:24:19Z

0

I would do it like this:

function get_user_name(id, result) {
  var id = $(id).val();
  $.get("<?php echo e(url('home/get_user_name')) ?>/" + id,
  function (data) {
    //check if we get the message: username already taken
    if(data) {
      $(result).html(data);
      $('input[type=submit]', this).attr('disabled', 'disabled'); //disable button
      $('form').bind('submit',function(e){e.preventDefault();}); //disable form
    } else {
      $('input[type=submit]', this).removeAttr('disabled', 'disabled'); //enable button
      $('form').unbind('submit'); //enable form
    }
  });
}

answered Jul 9, 2019 at 11:24

designtocode

2,2554 gold badges23 silver badges37 bronze badges

Collectives™ on Stack Overflow

How to disable form submit button if the username already exits in database ? (by js, ajax, php(laravel))

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related