开发者

Submit button question

Can I turn a link开发者_运维问答 for example <a href="#">submit</a> into a submit button for a form? If so how? I'm using PHP, MySQL, XHTML and CSS.


You can call submit() on your form. Like:

<a href="#" onclick="document.getElementById('myForm').submit();">e</a>

Which is something I really would not recommend, but its the answer to your question.


Not a real one.

You can fake it with JavaScript, but this violates Rule 2.

You can use CSS to make a submit button look like a link, but this isn't generally a good idea (although still a better one than using JS). Users expect buttons to submit forms, and for links to just go somewhere. Violating expectations is poor usability.


With javascript you can do a onclick

In jquery:

$('theElement').click(function(){ 
// submit the form...
});

Edited: (I wrote onclick!)


You can use jQuery for unobtrusive javascript practices and submit the form:

<form id="form_id">
 ...........
</form>

<a href="#" id="submit_link">submit</a>

jQuery:

$(function(){
  $('#submit_link').click(function(){
    $('#form_id').submit();    
    return false;
  });
});


(TESTED ON SAFARI and FF / OSX) I do not have DOS machine at home.

The answer to the question is Yes.

This is how you would code it in plain Javascript:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
      <title>Form Submit</title>
      <script>
        window.onload = function(){
          document.getElementById("linksubmit").onclick = function(){
            if(document.getElementById("foo").value != ''){
              document.forms[0].submit();
                  return false;
            }else{
              alert('Please fill in Foo');
            }
          }
        }
      </script>
  </head>
  <body>
    <form id="theform" action="index.html" method="post">
      <label for="foo">Foo</label>
      <input type="text" name="foo" id="foo" />
      <a href="javascript:void(0);" id="linksubmit">Submit</a>
    </form> 
  </body>
  </html>  

And this how you would code it with jQuery:

$(document).ready(function(){
  $("#linksubmit").click(function(){
    if($("#foo").val()!=''){
  $("#theform").submit();
      return false;
    }else{
      alert('Please fill in Foo');
    }
  });
});

Just use this piece between the script tags instead of the first example. Also remember to add the jQuery source code. Google has a hosted version that is good to use: http://code.google.com/apis/ajaxlibs/documentation/index.html#jquery


<script language="javascript">
  function submitform()
  {
    document.form1.submit();
  }
</script>

<form name="form1"></form>

<a href="javascript:submitform()">Submit</a>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜