Solved

Below Regex is not firing when using with jQuery 1.9.1

Posted on 2014-03-31
9
287 Views
Last Modified: 2014-04-07
I am trying to prevent Po Box being allowed in the Shipping Address, here is my code

<script type="text/javascript">
$(document).ready(function($) {
    
	$('input[name=ShipAddress1]').each(function() {
    var pattern = new RegExp('[PO.]*\\s?B(ox)?.*\\d+', 'i');
    if ($(this).val().match(pattern)) {
        $(this).after('<span class="nopo"> We cannot deliver to PO Boxes</span>');
     }
     });
	
});
</script>

What am I missing?

Thanks

Open in new window

0
Comment
Question by:niceoneishere
  • 4
  • 4
9 Comments
 
LVL 35

Expert Comment

by:Terry Woods
ID: 39967627
Try this:
    var pattern = new RegExp('P[ .]?O[ .]?B([Oo][xX])?[^a-zA-Z]*\\d+', 'i');

Open in new window


If you have any cases that are still being missed, please post them (or a similar case) as an example so we can adjust the pattern.
0
 
LVL 1

Author Comment

by:niceoneishere
ID: 39967650
Thanks for replying, here I have made a demo

Demo in jsfiddle

Thanks and I am trying display the message as soon as the text is entered in the text box.

Appreciate it
0
 
LVL 35

Expert Comment

by:Terry Woods
ID: 39967664
To explain the problems with the original pattern, this part of the pattern:
[PO.]*
means match any number (including zero) of the specified characters, so it would match an empty string. The remainder of the pattern required a "B" character and at least one number, which would mean these cases would match:
Beautiful Rd Apartment 3
Foo Boulevard Flat 1

Open in new window

Will have a look at the jsfiddle now.
0
 
LVL 35

Expert Comment

by:Terry Woods
ID: 39967702
Note the pattern I've provided probably shouldn't have the ignore case flag used with it ('i'), although turning that off will cause it to miss cases like po box.

Anyway, the pattern I provided seems to work ok in jsfiddle. The pattern requires a number to be present before the validation will fail though. Also, the validation is run when the page is loaded, and doesn't revalidate as the user types; did you intend for it to validate as the user types in text?
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 
LVL 1

Author Comment

by:niceoneishere
ID: 39967717
Thanks for replying so quickly,

basically what I am looking is when the textbox becomes focused or when the cursor is inside the text box I just want a simple message next to the input box saying PO Boxes are not allowed

Thanks again
0
 
LVL 1

Author Comment

by:niceoneishere
ID: 39968311
Hi There, I have modified by script to below now its firing but the form is also getting submitted when I click the submit button How to prevent that.

<script type="text/javascript">
 function cForm(){
 	var input = $('input[name=ShipAddress1]');
    var inputValue = input.val().toUpperCase();
    var poBoxIdentifiers = ['PO BOX', 'POBOX', 'GPOX'];
    for(var i = 0; i < poBoxIdentifiers.length; i++) {
      if (inputValue.indexOf(poBoxIdentifiers[i]) !== -1) {
        alert('We don\'t ship to Po Boxes');
        input.val('').focus();
    }
  } 
 }

</script>

Open in new window


and I added onsubmit event to my form like

<form id="form1" method="post" action="/payment.html" onsubmit="return cForm(this)">

Thanks

Open in new window

0
 
LVL 35

Assisted Solution

by:Terry Woods
Terry Woods earned 200 total points
ID: 39968320
Perhaps add "return false;" after the focus() call?
0
 
LVL 9

Accepted Solution

by:
Derek Jensen earned 300 total points
ID: 39983632
@Terry,

No, what he needs to do is have his function submit the form after line 11 and return false after line 9, and then change his onsubmit to...well, it should all look like this:

<script type="text/javascript">
function cForm(){
    var input = $('input[name=ShipAddress1]');
    var inputValue = input.val().toUpperCase();
    var poBoxIdentifiers = ['PO BOX', 'POBOX', 'GPOX'];
    for(var i = 0; i < poBoxIdentifiers.length; i++) {
        if (inputValue.indexOf(poBoxIdentifiers[i]) !== -1) {
           alert("We don't ship to P.O. Boxes");
           input.val('').focus();
           return false;
        }
    }
    document.form1.submit();
}
</script>

<form id="form1" name="form1" method="post" action="payment.html">
<!-- the rest of the form here -->
<input type="button" onclick="cForm(); return false;" />
</form>

Open in new window

0
 
LVL 1

Author Closing Comment

by:niceoneishere
ID: 39984046
Thanks
0

Featured Post

Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

Join & Write a Comment

Suggested Solutions

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now