Zombie.js can't find button element on page - css

I'm trying to submit a form with zombie.js, and pressButton() is failing with "Error: No BUTTON 'xxx'", where xxx is the selector. Here is the app:
var Browser = require('zombie');
b = new Browser();
b.visit('https://www.example.com/login/', function() {
b.
fill('name', 'My Name').
fill('code', 'My Code').
pressButton('submit', function() {
console.log(b.html());
});
});
And here is the form:
<form method="post" class="login">
<p> <label for="name"> <span id="nameprompt">Your Name:</span> </label> </p>
<input name="name" id="name" value="" size="40" maxlength="40" />
<p> <label for="code"> <span id="codeprompt">Bar Code</span> </label> </p>
<input name="code" id="code" type="PASSWORD" value="" size="40" maxlength="40" />
<div class="formButtonArea">
<input type="image" src="/screens/pat_submit.gif" border="0" name="submit" value="submit" />
</div>
</form>
I've tried a bunch of selectors including things like ".formButtonArea input" in addition to the obvious "submit" with no success.
What am I doing wrong?

It seems like you need the input to be of type="submit" (or type="button" perhaps). According to https://groups.google.com/forum/?fromgroups=#!topic/zombie-js/8L0_Cpn8vVU, where the author comments on clickLink, it's likely that clickButton will do the same: find buttons and then fire click.
Hope it helps.

Related

Anchor tag acts as a form submit button?

Anchor tag acts as a form submit button?
<form method="get" action="<?php bloginfo('url'); ?>/">
<div class="field-search">
<input type="text" class="form-control input-lg" placeholder="Search for..." value="<?php the_search_query(); ?>">
<i class="fa fa-search font-16"></i>
</div>
<form action="test.aspx" type="POST">
<label>
<span>Username</span>
<input type="text" name="UserName" id="UserName" class="input-text required" />
</label>
<label>
<span>Password</span>
<input type="password" name="Password" id="Password" class="input-text required" />
</label>
<label>
<input type="checkbox" name="RememberMe" id="RememberMe" class="check-box" />
<span class="checkboxlabel">Remember Me</span>
</label>
<div class="spacer">
Login
</div>
</form>
jquery
$(document).ready(function(){
$(document).on("click",".login-button",function(){
var form = $(this).closest("form");
//console.log(form);
form.submit();
});
});
possible duplicate of
(Anchor tag as submit button?)
(This is a copied answer)
Try this approach see if it works.
Add a click event to your anchor tag as below and do a event.stopPropagation()
$('a').on('click', function(e){
e.stopPropagation();
})`
See if this works

Making break line without using <br/>

I want to display the first input[email] and my button in one line and make the rest in another line, Also want to disable default style for my checkbox and display it with transparent background.
<form method="post" name="form_BE_box" action="">
<input type="email" name="mail" placeholder="Votre adresse mail" id="MAIL"/>
<button class="button" type="submit">S'inscrire</button><br/>
<input type="checkbox" checked="checked" value="Partenaire" name="fou" /> Cochez ici pour s'inscrire aux communications partenaire
</form>
You can include your input into a div. Here is a working jsfiddle.
And regarding the checkbox you can take a look at this answer: stackoverflow
<form method="post" name="form_BE_box" action="">
<input type="email" name="mail" placeholder="Votre adresse mail" id="MAIL"/>
<button class="button" type="submit">S'inscrire</button>
<div>
<input type="checkbox" checked="checked" value="Partenaire" name="fou" /> Cochez ici pour s'inscrire aux communications partenaire
</div>
</form>

Set a Virtual Page View with Universal GA

This is my HTML from. and i'm trying to set a Virtual Page View when submitting the form but i just can't make it work.
Pls advice
<form id="frmContact" action="post.php" method="post">
<div class="form-right-pnl">
<input type="text" class="required name" size="40" placeholder="×©× ×ž×œ×:" name="full_name">
<input type="text" class="required phone" size="40" placeholder="טלפון:" name="phone">
<input type="text" class="required email" size="40" placeholder='דו×"ל:' name="email">
<span>מ×שר קבלת ×—×•×ž×¨×™× ×¤×¨×¡×•×ž×™×™×</span>
<input type="checkbox" class="radio_btn" name="selling_a_property" checked value="Yes"/>
</div>
<div class="form-left-pnl" id='basic-modal'>
<input class="ddl_list" type="submit" value="" onClick=”_gaq.push([‘_trackEvent’, ‘Forms’, ‘Submit’]);” />
</div>
<div class="clear"></div>
</form>
Change this line
<input class="ddl_list" type="submit" value="" onClick=”_gaq.push([‘_trackEvent’, ‘Forms’, ‘Submit’]);” />
for
<input class="ddl_list" type="submit" value="" onClick=”_gaq.push(['_trackPageview', '/virtual-page-view-on-click-submit-button']);” />

How to send e-mail from form in wordpress

I am new in programing and WordPress. I want to send a e-mail from my form with a message, phone, ect. Can anyone tell me how can i do that?
Here is my code so far...
<div id="form">
<?php
add_filter('wp_mail_content_type','set_content_type');
function set_content_type($content_type){
return 'text/html';
}
?>
<div id="name">
<p id="username"> Name: </p>
<input type="text" name="name" class="textfield">
</div>
<div id="name">
<p id="username"> Email: </p>
<input type="text" name="name" class="textfield">
</div>
<div id="name">
<p id="username"> Phone: </p>
<input type="text" name="name" class="textfield">
</div>
<div id="name">
<p id="username"> Message: </p>
<input type="text" name="message" class="textarea">
</div>
<input type="button" value="SEND" id="btn">
</div>
To send mail from a form with following fields, open a new file and copy these lines and save (e.g. mail.php):
<?php
//sending mail
if(isset($_POST['sub']))
{
$uname=$_POST['uname'];
$mailid=$_POST['mailid'];
$phone=$_POST['phone'];
$message=$_POST['message'];
if(mail($uname,$mailid,$phone,$message))
{
echo "mail sent";
}
else
{
echo "mail failed";
}
}
?>
<form name="frm" method="post" action="#">
<label for="uname">Name:</label>
<input type="text" value="" name="uname" id="uname"><br/>
<label for="mailid">Email:</label>
<input type="text" value="" name="mailid" id="mailid"><br/>
<label for="mobile">Phone:</label>
<input type="text" value="" name="phone" id="phone"><br/>
<label for="message">Message:</label>
<input type="text" value="" name="message" id="message"><br/>
<input type="submit" value="Submit" name="sub" id="sub">
</form>
It will have to be much more complicated than what you have at the moment.
My first recommendation would be to use some, rather top-heavy, form plugins, But you will save yourself a lot of time and trouble like that.
http://www.deliciousdays.com/cforms-plugin/
http://wordpress.org/extend/plugins/contact-form-7
My 2nd recommendation would be to follow a popular tutorial for a full custom form to email script.
http://www.catswhocode.com/blog/how-to-create-a-built-in-contact-form-for-your-wordpress-theme
Note: Beware of spam bots and various other possible dangers of just putting a public form up on the web. If's very possible that you will have a hole in your custom code and a could cause some damage if exploited by the right person.

When label tag should be used over span/dev tags in html form?

When label tag should be used over span or dev in form?
Example:
option1-span:
<form action="">
<span>Name:</span><input type="text">
<input type="submit" />
</form>
option2-label:
<form action="">
<label>Name:</label><input type="text">
<input type="submit" />
</form>
option3-div:
<form action="">
<div style="display:inline;">Name:</div><input type="text">
<input type="submit" />
</form>
Thanks
This is what label tags are for:
<form action="">
<label for="txt">Name:</label><input type="text" id="txt" name="txt" />
<input type="submit" />
</form>
Then clicking on the label will focus on the input element.
The label tag is primarily used along with the for attribute. This aids in web accessibility of forms. For example
<form>
<label for="firstName">First name:</label>
<input type="text" name="firstName" value=""/>
</form>
By using the for tag, we can essentially associate the text "First Name:" with the input field having the name = "firstName".
Aside from that it has other attributes allowed but the span is more regularly used for styling markup.

Resources