ASP.NET MVC，在“文本框”旁边显示文本

Question

How can I display a text just next to the Text Box using jQuery, like if Name is not entered in the Form, so after clicking the Submit Button it will show the Text just next to the Name Text Box and I don't want to use the validation for this, I am checking the Text Box value using simple jQuery coding..? Here is my Code..

$('#btnAddContact').click(function () {
        if ($("#name").val().length <= 0) {
             $("#name").val("");
             $("#name").focus();
});

Answer 1

I think you are trying to use for validation message display

1. Then put the textbox in a div
2. Add float:left to textbox in css
3. Then write content in to div or you can create a label or span in to that div and apply css float:right to that span or lablel

Answer 2

Just place a hidden div next to the name and display it on your function:

<div id="errorName" style="display:none">Name can't be empty</div>

And then the function:

$('#btnAddContact').click(function () {
    if ($("#name").val().length <= 0) {
         $("#errorName").fadeIn();
         $("#name").val("");
         $("#name").focus();
    }
    else
       $("errorName").fadeOut();
});

Answer 3

Will add a new div after the name if it do not exist.

$('#btnAddContact').click(function () {
  var msg = $('#name-message');
  if (msg.length == 0) {
      msg = $('<div id="name-message"></div>')
      $('#name').after(msg);
  }

  msg.html('Opps. Error!');   
});

Answer 4

you can easily do it like this

$('#btnAddContact').click(function () {
        if ($("#name").val().length <= 0) {
             $("#name").val("");
             $("#name").after('<span>Please enter name</span>');
             $("#name").focus();
        }
});