Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    New to the CF scene
    Join Date
    Aug 2010
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Newbie question (not a dumb one I hope)

    I know enough about Javascript to spell the word correctly.

    What I would like to do is to be able to have a button/link on a webpage - the webpage describes a product.

    The name of the product is between a tag <h1>Free £5 notes</h1> ,<h2> ,whatever...

    This button when clicked should take the product name and then get used in creating an email subject line, so that the mails says
    To email address whatever eg free@fivepounds.com Subject Free £5 notes.

    So:- Mailto etc ?subject=Product name (free £5 notes)

    Is there a simple way of using Javascript to look for a string on a page, then placing the string into some code that will create a ?subject= string on an email?

    Hopefully this makes sense.

    I am currently reasearching this, but it's a slow process as it's new to me, I am not asking anyone to do my homework, but any tips or pointers gratefully taken.

    Thanks in advance RobMcp

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,537
    Thanks
    77
    Thanked 4,381 Times in 4,346 Posts
    Well, first of all, you don't want to use JavaScript to send the email.

    That only works in some browsers and even then only with some email clients.

    For example, if the person uses only web-based email (Gmail?) the mail won't get sent.

    You should, instead, use some server-side code to send the email. Most web hosts supply a simple server-side script to do this. Usually a PHP script for Linux hosts and and ASP script for Windows hosts, but that can vary. So ask your web host what they have available.

    And you don't need JavaScript to "look for a string on a page". Just set up the HTML in such a way that it all happens automagically.

    The hard(?) part here is collecting the user's email address. How do you want *that* to happen? When they click on the link/word/phrase? Or do they enter the email address first? Or???
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    New to the CF scene
    Join Date
    Aug 2010
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks

    Re your answer

    I don't want to send a mail, just want a mail to open ready for sending mailto: etc

    Unfortunately I don't have full access to the HTML .ASP( it's our base code and you can't mess with it)
    - which is why I want to look for a string that I know exists.(prod name)

    I know you can use js to look for strings/content on a page, just don't know how.

    I don't need to know the users email, all I want is a button which when clicked will open an email window (most folk have Microshaft of some incarnation)for them to enquire about a product, if they have Gmail tough, I'm going for a nice to have lowest common denominator, I don't know enough to be clever and fill in all the gaps yet.
    (Clever costs time and money, I only have one of those!)

    So, how DO you find a string on a page?

    Cheers. McP

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,537
    Thanks
    77
    Thanked 4,381 Times in 4,346 Posts
    Okay...

    If you know that kind of tags that the name is between, it's really easy.

    Your example:
    <h1>Free £5 notes</h1>

    So you could easily do:
    Code:
    var h1s = document.getElementsByTagName("h1");
    for ( var i = 0; i < h1s.length; ++i )
    {
        var h1 = h1s[i];
        var text = h1.innerHTML;
        ... do something based on value of text ...
    }
    I'm still not clear if you are just looking for the *existence* of "<h1>Free £5 notes</h1>" or if you mean that the <h1>'s might contain any of many products. So I don't know how you will identify an <h1> with the product name vs. one without. But I'll leave that to you.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    New to the CF scene
    Join Date
    Aug 2010
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Thanks

    Thanks for the pointer Pedant,

    I will play with the code (Lord knows how long it will take, going through my reference books) (you may not hear from me for a while!, but like I said I don't want you doing my homework. The pointer is a great start.)

    To confirm, each product page will ALWAYS have a product name within tags <h1 product</h1>

    So all I have to to is pull out any text value between the two tags.

    The code example that you supplied, presumably I could put that in a .js file and call it from a click event?
    Thanks McP

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,537
    Thanks
    77
    Thanked 4,381 Times in 4,346 Posts
    The code example that you supplied, presumably I could put that in a .js file and call it from a click event?
    Yes. Put it into a function, of course, if you do that.

    If you only have ONE <h1>...product name...</h1> on the page, you don't need to use a loop:
    Code:
    function getProduct( )
    {
       var onlyH1 = document.getElementsByTagName("h1")[0];
       var text = onlyH1.innerHTML;
        ... do something based on value of text ...
    }
    Or, another option: If there are several H1's then if the one with product has, perhaps, a class specified, you could look for that.

    Example:
    Code:
    <h1 class="product"> ...xyz ...</h1>
    
    and then:
    
    function getProduct( )
    {
        var h1s = document.getElementsByTagName("h1");
        for ( var i = 0; i < h1s.length; ++i )
        {
            var h1 = h1s[i];
            if ( h1.className == "product" )
            {
                var text = h1.innerHTML;
    
               ... do something based on value of text ...
            }
        }
    }
    Many variations on the theme possible.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    RobMcP (09-18-2010)

  • #7
    New to the CF scene
    Join Date
    Aug 2010
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Still looking for pointers

    Hello Pedant thank you for your help so far, (and anyone else interested)
    I have gone away and worked on this, it seems it'll take even longer than I thought!

    I tried this code as a place to start.

    When I run it in Firefox, it sort of works in that it clears the page and does write the value in the H1 tag, but the tab that is open constantly shows a timer as if it is waiting for something.

    If I run the code /page in IE8, I get a nasty activex messge, click to ok that, then nothing happens.

    I am trying a logical (to me) progression get the code to do a little of what you want, then add more steps until it does what you want. I don't want it to document write, I want to put the H1 tag value into the ?subject of a mailto, but document.write I suppose is a way of seeing if at least somthing is working (please....)

    I am sure this code is full of hundreds of glaring simpleton mistakes, but you have to start somewhere and this is the first time I've tried to get javascript to do something useful.
    Can anyone spot the (not) deliberate mistakes?

    CODE:
    <title>Find product</title>

    <script language="javascript1.5">
    function getProduct( )
    {
    var onlyH1 = document.getElementsByTagName("h1")[0];
    var product = onlyH1.innerHTML;
    document.write(product);
    }
    </script>
    </head>

    <body>

    <h1>This is the Product Name</h1>
    <p> Page content </p>

    <p>
    <form>
    <INPUT TYPE="button" VALUE="Get Product Name"
    onClick="getProduct()" >
    </form>
    </p>

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,016
    Thanks
    203
    Thanked 2,538 Times in 2,516 Posts
    Code:
    <script type = "text/javascript">
    
    function getProduct() {
    var onlyH1 = document.getElementsByTagName("h1")[0];
    var product = onlyH1.innerHTML;
    alert(product);
    }
    </script>
    </head>
    
    <body>
    
    <h1>This is the Product Name</h1>
    <p> Page content </p>
    
    <p>
    <form>
    <INPUT TYPE="button" VALUE="Get Product Name" onClick="getProduct()" >
    </form>
    </p>


    I trust that you have taken on board Old Pedant's remarks about the unreliability of mailto:

    The trouble with using this method (mailto) to send form results is its unpredictability. The method it is highly dependent on the browser in use and the email client in use (some people have only Yahoo or Hotmail). In particular, your visitor must have Outlook or Outlook Express as the default client for this to work correctly. Even if your visitor is using Internet Explorer, but the default mail client is different (e.g. Eudora), your mailto form will not work. With all of the browser troubles, you're likely to lose about half of your users' messages. Most of the email clients that can successfully send a mail will prompt the user by a security dialog prior to sending - this can scare many users from continuing. Also, what about people with Javascript disabled?

    In fact few browsers these days accept mailto: as a form action. You need a really old browser for it to work as more modern browsers simply open the email program (if any) and ignore the form. If you are going to use a form then use a server-side formmail script as the action - there are several good free ones out there.



    Quizmaster: In maths, what number is represented by 10 to the power of 3?
    Contestant: Six.
    Last edited by Philip M; 09-18-2010 at 02:54 PM.

  • #9
    New to the CF scene
    Join Date
    Aug 2010
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Mailto: yuk nasty horrid

    Thank you Phillip, I've taken on board the mailto comments, and I am going to add a page to the site with a form and nice tidy CAPTCHA so the process is done by the site.

    My main problem was obtaining the product name, and passing it.
    So in one sense I'm a little further on, in another it's back to the drawing board. As I now have to get the product name, hold on to it, then pass it as a variable to a new page, asp.net oh dear more manuals.
    McP

  • #10
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,537
    Thanks
    77
    Thanked 4,381 Times in 4,346 Posts
    Code:
    function getProduct() {
        var onlyH1 = document.getElementsByTagName("h1")[0];
        var product = onlyH1.innerHTML;
        window.open( "sendMailPage.aspx?product=" + escape(product), "_BLANK",
                     "width=600,height=400,scrollbars=no" );
    }
    That will open the mail page in a popup, with a window of the size given, etc.

    In your ASP.NET code, you get the requested product as
    Code:
        Dim product As String = Request.QueryString("product") ' VB.NET
    or
        String product = Request.QueryString("product"); // C#
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •