Mac Address Input Box - mask

I'm creating an input box that will only allow 17 characters and is formatted to display as a mac address.
I've added the first 11 characters, the rest the ( last 4 digits of mac) will be added by the user. Is there any way to stop them deleting the initial characters I've preset ?
<script>
function macAdd(val){
if (/[^\w-]|_/.test(val))
{alert("invalid form only alpanumeric and -")
return val}
val=val.replace(/[^\w-]|_/g,'')
val=val.replace(/(\w{2})([^-])/g,'$1'+'-'+'$2')
val=val.replace(/-$/,'')
return val
}
</script>
<input type="text" onkeypress="this.value=macAdd(this.value)" size="30" value="00-00-00-00" maxlength="17"> </p>
Thanks

This seems to achieve what I'm looking to do.
<form>
<input type="text" style="width:130px;" value="00-00-00-00-" readonly><input type="text" style="margin-left : -50px;width:50px;" maxlength="5" onkeypress="this.value=macAdd(this.value)">
</form>

Related

Replacing entire entry-content contents in WordPress

I am developing a WordPress plugin that is inserted onto the page by adding a token to the page content.
So, on the page there is some introductory text with the contents of the plugin below. On postback, I would like to clear the introductory text and just show output from the plugin.
I know I could do this using jQuery by replacing the contents of $(".entry-content").html("plugin output"); but I wanted to ask if there was a WordPress native method of doing this instead.
UPDATE
The following is one of the files from the plugin. It is on the POST (the if condition) that I want to replace the page content, with the output of the function. On the GET (the else condition) I just want to append the output of the function to the content.
<?php
/*
The following code utilizes Heredoc syntax.
It is very important to note that the line with the closing identifier must contain no other characters, except a semicolon (;).
That means especially that the identifier may not be indented, and there may not be any spaces or tabs before or after the semicolon.
It's also important to realize that the first character before the closing identifier must be a newline as defined by the local operating system.
This is \n on UNIX systems, including Mac OS X.
The closing delimiter must also be followed by a newline.
*/
class WHRFContactUs {
function GenerateContactUsForm() {
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
$sendgrid = new SendGrid($GLOBALS['MailAPIKey']);
$email = new SendGrid\Email();
$email
->addTo($GLOBALS['MailAPISender'])
->setReplyTo($_POST['Email'])
->setFrom($GLOBALS['MailAPISender'])
->setSubject($_POST['Subject'])
->setHtml($_POST['Message'] . '<br /><hr/>' . $_POST['FullName'] . ' ' . '(' . $_POST['Email'] . ')<br/>' . '<br />')
;
try
{
$sendgrid->send($email);
$html = <<<HTML
Your message has been successfully sent. Thank you for taking the time to provide us your feedback.
<br/><br/>
In the event that your feedback requires a response, a representative will contact you as soon as possible.
HTML;
}
catch(\SendGrid\Exception $ex)
{
echo $ex->getCode();
foreach($ex->getErrors() as $er) {
echo $er;
}
}
}
else
{
$html = <<<HTML
<form method="post" id="ContactUsForm" action="{$_SERVER['REQUEST_URI']}">
<div class="form-group">
<label for="FullName" class="sr-only">Your full name</label>
<input type="text" class="form-control" id="FullName" name="FullName" placeholder="Your full name" data-validation-required="Please enter your full name.">
</div>
<div class="form-group">
<label for="Email" class="sr-only">Your email address</label>
<input type="email" class="form-control" id="Email" name="Email" placeholder="Your email address" data-validation-required="Please enter your email address." data-validation-format="Please enter a valid email address.">
</div>
<div class="form-group">
<label for="Subject" class="sr-only">Subject</label>
<input type="text" class="form-control" id="Subject" name="Subject" placeholder="Subject" data-validation-required="Please enter a subject.">
</div>
<div class="form-group">
<label for="Message" class="sr-only">Message</label>
<textarea class="form-control" id="Message" name="Message" placeholder="Your message..." data-validation-required="Please enter a message." rows="4"></textarea>
</div>
<button type="submit" id="ContactUsFormSubmit" name="ContactUsFormSubmit" class="btn btn-primary">Send message</button>
</form>
<script type="application/javascript" src="{$GLOBALS['WHRFPluginPath']}scripts/whrf-contact-us.js"></script>
HTML;
}
return $html;
}
}
add_shortcode('ContactUsForm', array('WHRFContactUs','GenerateContactUsForm'));
?>
As mentioned in the comments, without knowing how that content is being added it isn't really possible to know how to replace it.
However, there's a possibility of achieving that in a very disruptive and ill-advised way:
Chances are that content is being added by using the filter the_content.
So you could disruptively have a high-priority modification for the content and then remove that filter to stop the other content from being added. As follows:
function my_disruptive_filter($content) {
remove_all_filters('the_content');
return 'my custom content';
}
add_filter( 'the_content', 'my_disruptive_filter', -999, 1);
I'm not 100% sure if a this would work, since I've never tried it.
Also remove_all_filters takes a second parameter that's $priority which is optional. You can target all priorities that are lower that the one using with this hook, via a for loop. But I assume without providing that parameter it would just remove all of them.
Warning
The reason that this is very disruptive is that it would prevent any other code from using that filter. Another developer (or even yourself) might want to use that filter later at some point and it won't work and you have no idea why. Could be a very difficult situation to get out of.
Also this might prevent existing plugin theme from adding their content, so if you wind up using and see missing stuff -- the reason could be this.
Note: this is really a hit-or-miss solution because it depends on how that content is being added.
The function the_content() returns the page content, if you want to overwrite this using your own plugin you should remove this line in whatever page you are (usually page.php/single.php in theme dir) with your custom plugin output.

Can't find element using xpath

So, here are two divs
<div class="th_pr"><input id="user_email" class="accounts_input" type="text" size="30" placeholder="Email" name="user[email]"></input><p class="accounts_error_text" style="display: block;">
email is invalid
</p></div>
<div class="th_pr"><input id="user_password" class="accounts_input" type="password" size="30" placeholder="Password" name="user[password]" autocomplete="off"></input><p class="accounts_error_text" style="display: block;">
password can't be blank
</p></div>
I need to get those elements with texts "email is invalid" and "password can't be blank" by text, cause it will differ depending on input.
I've been trying to complete this using xpath :
By.xpath("//p[contains(.,'email is invalid')]")
and
By.xpath("//p[contains(.,'password be blank')]")
but i get nothing.
resultEmail = ExpectedConditions.invisibilityOfElementLocated(By.xpath("//p[contains(.,'email is invalid')]")).apply(driver);
returns true, although the element is visible.
Please help.
Try xpath
//input[#id='user_email']/following-sibling::p
//input[#id='user_password']/following-sibling::p
Then you have
WebElement emailParagraph = driver.findElement(By.xpath("//input[#id='user_email']/following-sibling::p"));
System.out.println(emailParagraph.getText());
Did you try using the text() method within the xpath?
driver.findElement(By.xpath("//p[contains(text(), 'email is invalid')]"));
Rather than using the .?
Please try this:
WebElement userEmailErrorMessage = driver.findElement(By.cssSelector("div[class=\"th_pr\"]:nth-child(1) > p"));
WebElement userPasswordErrorMessage = driver.findElement(By.cssSelector("div[class=\"th_pr\"]:nth-child(2) > p"));
Using these elements you will be able to read the error messages for the respective input controls.

How to pass values from one Contact Form 7 form to another in Wordpress?

I have a site that has 2 forms - a short form and a long form. If you look at http://dforbesinsuranceagency.com you'll see the short form next to the masthead photo. The long form is at http://dforbesinsuranceagency.com/request-free-insurance-quotes/
When the user hits Submit on the short form, it kicks them over to the long form page, so that part works fine. The part that gives me fits is that I need the values entered into the short form fields First Name, Last Name, Email Address and Telephone passed to their equivalent fields on the long form.
How do I do this?
This is how I am redirecting the short form to the long form (I added it to the Additional Settings section for the short form):
on_sent_ok: "location = 'http://dforbesinsuranceagency.com//request-free-insurance-quotes';"
Any help would be appreciated.
Hack, hack, hackety, hack hack hack... Without suggesting "not using a form-builder" I don't think there is an elegant solution - you can't use the other PHP method suggested without modifying the plugin itself (and that is a can of worms). I will propose a Javascript solution but there are some caveats (below):
jQuery(document).ready(function($){
$('#quick-quote form:first').submit(function(){
var foo = {};
$(this).find('input[type=text], select').each(function(){
foo[$(this).attr('name')] = $(this).val();
});
document.cookie = 'formData='+JSON.stringify(foo);
});
var ff = $('#container form:first');
if(ff.length){
var data = $.parseJSON(
document.cookie.match('(^|;) ?formData=([^;]*)(;|$)')[2]
);
if(data){
for(var name in data){
ff.find('input[name='+name+'], select[name='+name+']').val(data[name]);
}
}
}
});
What this will essentially do is: on submission, store your mini-form options in a cookie. On page load it will then look for a form in the main body of the page and apply any stored cookie data.
Notes
The jQuery selectors are deliberately ambiguous to avoid any future changes in your admin panel/plugin that will likely screw with the form IDs (thus breaking the script).
I'm not faffing about pairing field/option names - for example the select box in your mini-form is named insurance-type however the matching box in the main form is named ins-type - you will have to ensure they are of the same name.
This also applies to select box values - if there is no matching value, it will be ignored (eg. some of your values in the main form have » » characters in front (and so don't match).
try this.
set the action of our first form to a php file named xyz.php
<form method="post" action="xyz.php">
<input type="text" name="name">
<input type="text" name="email_address">
<input type="submit" value="Go To Step 2">
</form>
the file xyz.php will create a new form for you which in this case is your second form (the big one). Set the action of the form as required. the code of your xyz.php will look something like this.
<form method="post" action="form3.php">
<input type="text" name="name" value="<?php echo $_POST['name']; ?>">
<input type="text" name="email_address" value="<?php echo $_POST['email_address']; ?>">
<input type="radio" group="membership_type" value="Free">
<input type="radio" group="membership_type" value="Normal">
<input type="radio" group="membership_type" value="Deluxe">
<input type="checkbox" name="terms_and_conditions">
<input type="submit" value="Go To Step 3">
</form>
where the input fields of the first form will already be filled with the details given by the user in the first form.
You can create the first form by yourself and let the contact form create the second form for you providing the default values using the method above.
Hope this helps!

jQuery / PHP / WordPress: Autocomplete search "Foxycomplete" does not work

Problem solved after I found an other template. Seems the previous one is incompatible.
I'm using the Plugin Foxycomplete (advanced autocomplete search with images) - more specifically: I want to use it. I installed and enabled it. The developer explains one step like this:
Enter the ID of the Form Input Field WITHOUT THE '#' on which you wish to apply the Autocomplete functionaliy. Defaults to the Regular "s".
I've even looked at the file foxycomplete.js, but I don't get it:
(function($) {
$(document).ready(function() {
var inputField = site_data.inputField;
var inputWidth = 0;
var absPath = "";
if(site_data.inputField == ""){
inputField = "s";
}
After this I took a look at the search form with firebug and this is the HTML-code:
<form action="http://localhost/sites/wordpress/" class="searchform" method="get">
<input type="text" value="" name="s" class="field">
<input type="submit" value="" name="submit" class="submit">
</form>
Now I'm assuming that I have to change class = "field" to id = "s", but I also do not know in which document I find the HTML part, I am a little stuck. If I do the change in firebug, it doesn't work.
all you need to do is to add following to your "input type" - name="s", id="s". This worked for me on a Canvas theme, by woothemes, and should be cool with any other
as an example for your code:
<input type="text" name="s" id="s" value="" class="field">
edit: search form code location really different to each theme template. but in most cases it's in header or sidebar.

limit of characters in html

I have set the limit of characters on textbox but while typing the input if it exceeds from 9 character it continues type it another field without use of tab
<input data-val="true" data-val-regex="Please enter valid SSN" data-val-regex-pattern="^\d{3}-\d{2}-\d{4}$" id="Ssn" name="Ssn" type="text" value="" class="valid">
I want it should stop to take input.
You should use jQuery for example
<input data-val="true" maxlength=9 data-val-regex="Please enter valid SSN" data-val-regex-pattern="^\d{3}-\d{2}-\d{4}$" id="Ssn" name="Ssn" type="text" value="" class="valid"><br>
<script lang="text/javascript">
$("#Ssn").keyup(function(e)
{
var str=$("#Ssn").val();
if(str.length==9)
{
$("#Ssn").blur();
}
});
</script>
at this code you must include jQuery before
** Edit Misunderstanding
Use the maxlength attribute
<input data-val="true" data-val-regex="Please enter valid SSN" data-val-regex-pattern="^\d{3}-\d{2}-\d{4}$" id="Ssn" name="Ssn" type="text" value="" class="valid" maxlength="9">
pattern attribute regular expressions aren't fully supported in all browsers--specifically, those that do support them don't always obey complex regular expressions. I've noticed this in Safari, at least.
The maxlength attribute SHOULD work. Not sure why it's not for you. Maybe post a JSBIN example for us to look at.
That said, for complex client-side form validation, you still need to rely on javascript to support a broader range of browsers.

Resources