Jump to content

form input button inside an anchor tag


gr1zzly

Recommended Posts

Prepare to rofl at my stupidity...

 

<a class="admin_action" href="<?php echo $_SERVER['PHP_SELF']; ?>?action=create">
    <input type="button" value="Create a new post" title="Create a new page entry." />
</a>

 

For some reason this doesn't work in IE 8 (yet to test other IE's) but everything works fine in FF and Chrome?!

 

I'm not exactly sure about the 'good' / 'bad' practice of using form elements in this way, and yes I could just create a graphic or use css to make it look like a button. But really I just don't understand why this isn't working in IE.

 

Any ideas?

Link to post
Share on other sites

It's not working because it's invalid code. You can't put submit buttons inside anchor links like that.

 

It doesn't really make sense anyways - both anchor tags and inputs exist to allow user input - why would you be doubling up on them like that?

Link to post
Share on other sites

As I said, I appreciate that it may be 'bad practice' to use a form input element in this way. But if the code was invalid as you say then why would standards compliant (for the most part) browsers such as FF and Chrome work fine with it, and the world's most notoriously awkward browser (IE) dismiss it?

 

Plus I just passed it through the W3C validation tool with no error's other than those expected due the fact that this is a php include file!

 

Besides the fact that buttons have been used for links since the early days, I'd have thought that my intent to use an input button in this way was obvious. I mean a link is a link, it's just blue text (unless I style it) whereas a button looks....well like a button!

 

I didn't ask for a critical analysis of my methods, just an explanation as to why IE wont run it when the other browsers will. If people had an alternative method to suggest that would achieve the same results both visually and functionality wise then by all means suggest them.

Link to post
Share on other sites

Interesting, it is valid code. I thought it was invalid.

 

But again, regardless of the fact that its valid or not, what are you trying to do with it? I guess I can see what you are trying to do, though I would recommend just taking a screenshot of an input button, and using that as the background image for your link tag.

 

I don't know why IE wouldn't like this, but its probably for the reasons I mentioned earlier - its doubling up on the user interaction, and it probably confuses IE.

 

Also, I don't get what you mean by errors popping up because of an included file - the validator has no idea that files are included, as far as validators are concerned, its all one document. It's possible that your button isn't working because of one of these errors.

Link to post
Share on other sites

:shrug:  hmph - yeah I guess I'll have to style / image it, or at least try it with IE to see if that's the problem.

 

I should point out though that the input's type is set to 'button' not 'submit' so I'm not really doubling on user input as the page will only see that the link is clicked (theoretically anyway) since the 'form' is never acutally being submitted.

 

Surely though it would make sense for the W3C to include the href attribute for button / input tags? Wouldn't that make life easier for a lot of people, or maybe just me? - lols  ;)

 

- Edit - Oh yeh and the validation errors were due to no doctype, header or body tags etc. due to the structure of php page and where this file is included.

Link to post
Share on other sites

Wouldn't something like this be a lot better?

 

<input type="button" value="Create a new post" title="Create a new page entry." onclick="javascript:window.location=<?php echo $_SERVER['PHP_SELF']; ?>?action=create"/>

 

I'm not that great with Javascript so I might (probably) be using the syntax a little incorrectly.

Link to post
Share on other sites
- Edit - Oh yeh and the validation errors were due to no doctype, header or body tags etc. due to the structure of php page and where this file is included.

 

Well there is your problem right there. If browsers don't have a properly structured document, they have to make guesses on how to deal with the code, and often guess wrong. Basically, you are abandoning all control if you don't structure your document right, and leaving your document  in the hands of a non-thinking machine.

 

Wouldn't something like this be a lot better?

 

<input type="button" value="Create a new post" title="Create a new page entry." onclick="javascript:window.location=<?php echo $_SERVER['PHP_SELF']; ?>?action=create"/>

 

Not really, as the link won't work for anyone who has javascript turned off, or is using a non-javascript browser.

 

Link to post
Share on other sites
  • 2 weeks later...
Well there is your problem right there. If browsers don't have a properly structured document, they have to make guesses on how to deal with the code, and often guess wrong.

 

I don't think that this is a related issue, I should explain...

 

The page DOCTYPE etc. is defined in the 'header' include on the main php page, the form's file is then included further down that page so I didn't bother writing specific declarations for this file since they would be redundant once the php passes it's output to html parsing.

 

But you have made me question the validity of this assumption!

 

Anyway, the validation errors I mentioned before were caused because I was only validating the form's 'incomplete ' html file.

 

If I can't get this to work as a 'button' I will have to fall back on a <a> tag with css or an image. Thanks for all your help and suggestions haku.

Link to post
Share on other sites

Your assumptions are correct there. If the header has the doctype, then not only do you not need to add it again in the included files, if you do include it it will invalidate your code!

Link to post
Share on other sites
  • 9 months later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.