Can I do both javascript and a PHP form?

Question

I want to take advantage of some jquery functions for sending messages like having a modal dialog but I also want to include users not running javascript.

If I have a jquery function to handle the dialog but the user doesn't have javascript enabled whats the best way to redirect them to my PHP page for composing and sending a message?

I'm assuming the jquery code takes highest priority since it's client side but then do I wrap my php code in tags?

Is there a more elegant solution?

I think you're confusing server-side and client-side code. What you do is you have a normal HTML form. You have JS override the submit functionality, and do whatever. If JS is off, the form would submit normally. — gen_Eric
– gen_Eric, Commented Jan 16, 2012 at 19:09
is this really worth worrying about anymore? this is only 1% max of users developer.yahoo.com/blogs/ydn/posts/2010/10/… — Evan
– Evan, Commented Jan 16, 2012 at 19:10
Evan @AdamRackis jrummel can we stop trolling and actually write HTML pages that actually work. non-javascript support is still important, it's called not breaking the bloody web. — Raynos
– Raynos, Commented Jan 16, 2012 at 19:13

Jeff Lauder · Accepted Answer · 2012-01-16 19:15:19Z

2

I think what I would do here is take advantage of the onclick event of the button. You can use javascript or jquery to return false. If the browser has javascript turned off, the form will then be submitted.

<input type="button" onclick="return btnClick()" value="submit">

and then in your javascript something like

function btnClick(){
    //do ajaxy stuff
    return cancelEvent()
}
function cancelEvent()
{
    if (window.event) window.event.cancelBubble = true;
    return false;
}

answered Jan 16, 2012 at 19:15

Jeff Lauder

1,2478 silver badges14 bronze badges

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

5 Comments

Raynos Over a year ago

avoid in line DOM0 event handlers. Also please make you cancelEvent function work. you need to call event.stopPropagation() because return false doesn't do anything in DOM event handlers (it's a non-standard extension)

Jeff Lauder Over a year ago

It does work, I pulled it from one of my working solutions. return false works everywhere that if (window.event) window.event.cancelBubble = true doesn't. Try it before suggesting that it doesn't work.

Raynos Over a year ago

Where in DOM3 events or DOM4 does it say that return false from an event listener will invoke event.stopPropagation(). It's a non-standard extension which may be removed at any time.

Raynos Over a year ago

Note that I meant event.preventDefault(); not event.stopPropagation();. My mistake.

Paul Over a year ago

That'll work perfectly. I'll handle my jquery modal dialog if enabled and if not I'll include a href tag. Thanks

gen_Eric · Accepted Answer · 2012-01-16 19:17:45Z

2

What you want to do is make a normal HTML form:

<form action="submit.php" method="POST" id="sendMessage">
   <input id="msg" name="message" type="text" />
   <button type="submit">Submit</button>
</form>

And then use jQuery to override the submit feature:

$('#sendMessage').submit(function(e){
  e.preventDefault(); // Stops the browser from submitting the form normally
  // Do stuff...
});

So, if JavaScript is enabled, jQuery will handle form submission. It it's not enabled, the browser will POST the form normally.

answered Jan 16, 2012 at 19:17

gen_Eric

228k42 gold badges304 silver badges343 bronze badges

Collectives™ on Stack Overflow

Can I do both javascript and a PHP form?

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related