I've looked at dozens of similar questions already but most solutions implement hidden inputs or extensive javascript and none have answered why one type of input works and the other doesn't.
This problem is specific to Internet Explorer, works on both Chrome and FF.
Here's my code to create the form:
#foreach (hello.Data.Models.Button btn in Model.Content.Buttons.OrderBy(b => b.Action))
{
if (btn.Action == "Close Message" && (Model.SurveyAuditExists == true || Model.SurveyContent == null))
{
<li class="response-button-item">
<input type="submit" class="response-button" name="#btn.Text" id="#btn.Text" onclick="submitForm.submit();" value="#hello.Biz.Helpers.ExtensionMethods.TrimString(btn.Text, new char[] { '&' })" />
</li>
}
And here's an example of the resulting HTML:
<form id="submitForm" action="/Go/Here/39354" method="post">
<ul id="response-button-list">
<li class="response-button-item">
<input name="&Agree" class="response-button" id="&Agree" onclick="submitForm.submit();" type="submit" value="Agree">
</li>
<li class="response-button-item">
<input name="&Disagree" class="response-button" id="&Disagree" onclick="submitForm.submit();" type="submit" value="Disagree">
</li>
</ul>
So when I click either Agree or Disagree on Chrome/FF it returns whether the user has Agreed or Disagreed but in IE it returns blank and results in an error as FormCollection and AllKeys are empty in my controller.
Changing the input type to checkbox and clicking on the box works and submits correctly in IE.
I haven't got nested forms in the page.
Any help would be appreciated!
From #stephenmuecke 's comment I tested the buttons without the JavaScript
onclick="submitForm.submit();"
As obviously this was competing with the input type="submit", removing the onclick attribute solved any issues.
So in the end the error was all my fault, hopefully this info helps someone else notice this quicker than I did.
Related
I have a submit button with text and I want to check for both.
i.e. the actual page has:
<input class="button" type="submit" value="Continue" tabindex="3"
name="nav[save]"></input>`
So I've tried
it "I can see the Continue button" do
expect(page.find('input[type="submit"]').find('input[value="Continue"]')).to be
end
but I get
Unable to find css "input[value=\"Continue\"]"
and
expect(page.find('input[type="submit"]')).
to have_selector('input[value="Continue"]')
but I get
expected to find css "input[value=\"Continue\"]" but there were no matches
If you want to check for both you can do it in single css selector like
input[type=\"submit\"][value=\"Continue\"]
Here's one solution that works with your view:
expect(find('.button').value).to eq 'Continue'
In the console:
[1] pry(#<Cucumber::Rails::World>)> expect(find('.button').value).to eq 'Continue'
=> true
I was just playing around a bit with Meteor.js when I ran into this strange issue, I have a form with two textfields, but somehow my event is not listening to the submit.
When I remove one textfield, everything works fine ...
Below is my template for the form:
<template name="new_timer">
<div class="timer timer--empty">
<form id="new_timer">
<input type="text" name="timer__name" class="timer__name" placeholder="Timer name">
<input type="text" name="timer__description" class="timer__description" placeholder="Timer description">
</form>
</div>
</template>
And on the client side:
Template.new_timer.events({
'submit form': function(e) {
console.log('new timer');
e.preventDefault();
}
})
This doens't seem to work, however when I change my template to the following, it works
<template name="new_timer">
<div class="timer timer--empty">
<form id="new_timer">
<input type="text" name="timer__name" class="timer__name" placeholder="Timer name">
</form>
</div>
</template>
Am I just overlooking something very basic here?
You might add an event like
'keyup form': function(e) {
if (e.keyCode === 13) {
// do something
}
}
Basically using a submit in a single page application is not adapted. In this kind of application everything is event based, you never reload a page so you never really 'submit' a form.
The 'form' tag becomes useless, most of developers (including me) are keeping it by habit but it is not required.
It is a bit late for an answer, I hope it can help somebody else!
I had similar problem, submit event does not work with more inputs without this:
<input type="submit" hidden="hidden">
I've been looking on the internet for solutions as to why IE7 isn't opening links correctly for example
<button class="class1">Google</button>
Does IE7 not like having ?
I hear I should use jquery for this? But no one linked to any article.
According to the W3C's specifications on anchor (<a>) tags and <button> tags, you should be able to do that fine, but according to a quick Google search, you can't and/or shouldn't do it, and it doesn't work in Internet Explorer.
This article actually recommends adding Javascript, so the link can be opened in IE also:
<button type="button" onclick="window.location('http://www.expertsguide.info/')">Click Me to go to Experts Guide</button>
Although you can, you shouldn't have a button (<button>) inside anchor (<a>).
Add an event handler to the button like this:
<input type="button" value="Google" onClick="javascript:location.href = 'http://google.com';" />
Note: you should considered not doing this, for a variety of reasons. Bottom line you can (and should) style your <a> element to look like a button.
You're better off not using a button inside a hyperlink.
Style the hyperlink to look like a button.
Try these
http://www.webresourcesdepot.com/css3-buttons-10-awesome-ready-to-use-solutions-all-related-tutorials-you-need/
Try this:
<script>
$(document).ready(function() {
$('.class1').click(function() {
window.location = $(this).parent().attr('href');
return false;
}
});
</script>
Or simply remove the button tag and use this:
<script>
$(document).ready(function() {
$('a').click(function() {
window.location = $(this).attr('href');
return false;
}
});
</script>
To be JavaScript independent (so that it also works on browsers with JS disabled, in contrary to many other answers here), I'd suggest to just wrap it in a <form> the usual way and make it a <button type="submit"> (or <input type="submit">) instead.
<form action="http://www.google.com">
<button type="submit" class="class1">Google</button>
</form>
or
<form action="http://www.google.com">
<input type="submit" value="Google" class="class1" />
</form>
I have a partial View which contains a TextArea.
When i Render this parital view in my main view page the Text Area is coming disabled (but it not graying out) and not allowing any entry to be typed there.
//---Here are the code segement from my partial view---
<div id="AddComment" style="display:none">
<fieldset>
<legend>Add Comment</legend>
<p><label> Comment for:</label>- <select id="Station"></select></p>
**<%=Html.TextArea("UserComment", new { rows = 5, cols = 65})%>**** (this text area is the problem)
<p><input type="button" id="addComment" onclick="SaveComment()" value="Save" /></p>
</fieldset>
</div>
//-----end of code segment -----------------------
Please help
Thanks in advance.
I got the probem resolved. its was not the fault of the partial view Rendering.it was basically the script written on the main page to block the backspace keypress.
//--------------------below line of code prevents the browser to raise a backspace key press outside the editor---// //document.attachEvent('onkeydown', function(evt) { evt.returnValue = false; }); //-----------------------------------------------------------------------------------//...
once i removed this line thing started working. thanks you all for helping me
Google custom search code is provided as a form tag. However, Asp.net only allows a single form tag on a page. What is the best way to implement their code so you can include it on an aspx page (say as part of a Masterpage or navigation element).
You can have multiple form tags on an ASP.NET page. The limitation is on server-side (runat="server") form tags.
You can implement two form tags (or more) as long as only one has the runat="server" attribute and one is not contained in the other. Example:
<body>
<form action="http://www.google.com/cse" id="cse-search-box"> ... </form>
<form runat="server" id="aspNetform"> ... </form>
<body>
You may be able to have multiple form tags, but note that they cannot be nested. You'll run into all kinds of weirdness in that scenario (e.g., I've seen cases where the opening tag for the nested form apparently gets ignored and then its closing tag winds up closing the "parent" form out).
You'll need to remove the form tag and use javascript send the query. Have a look at
http://my6solutions.com/post/2009/04/19/Fixing-Google-Custom-Search-nested-form-tags-in-asp-net-pages.aspx
I have included the before and after code as well. So you can see what I've done to integrate it with blogengine .net.
You could use Javascript:
<input name="Query" type="text" class="searchField" id="Query" value="Search" size="15" onfocus="if(this.value == 'Search') { this.value = ''; }" onblur="if(this.value == '') { this.value = 'Search'; }" onkeydown="var event = event || window.event; var key = event.which || event.keyCode; if(key==13) window.open('http://www.google.com/search?q=' + getElementById('Query').value ); " /><input name="" type="button" class="searchButton" value="go" onclick="window.open('http://www.google.com/search?q=' + getElementById('Query').value );" />