Need help with a link

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • timmy_dale12@hotmail.com

    Need help with a link

    I need help with this one. I have a function that pastes a row. In
    each row i am pasting a link which is to call a date picker javascript
    function. This is the code that pastes the link :

    link = document.create Element('a');
    link.href ="javascript:sh ow_calendar('do cument.form1.da te',document.fo rm1.date.value) ;";
    img = document.create Element('img');
    img.setAttribut e("src","H:Dive rse\\cal.gif");

    link.appendChil d(img);

    var td3 = document.create Element("TD")
    td3.appendChild (input3)
    td3.appendChild (link)

    when i run this and press the link i get a error message that says :
    document.form1. date.value is null or not an object. The function
    show_calendar() has been tested in other contexts and works fine.

    Can anybody solve this one ?
  • timmy_dale12@hotmail.com

    #2
    Re: Need help with a link

    > Not without knowing the structure of your page.

    Okay here it comes.

    This is the main script, ive put it in a html page to illustrate how
    it works :

    -------------------------------------------------------------------------------

    <html>
    <head>
    <script type="text/javascript">
    function addRow(id){

    var index = document.form1. hidden.value;
    var tbody = document.getEle mentById(id).ge tElementsByTagN ame("TBODY")[0];
    var row = document.create Element("TR");
    row.setAttribut e("id","row" + index);


    //Clone this node
    var targetNode = document.getEle mentById('SELEC T')
    input1 = targetNode.clon eNode(true)
    input1.setAttri bute("name","se lect" +index)

    input2 = document.create Element("input" );
    input2.setAttri bute("name","a" +index)
    input2.setAttri bute("value","" )
    input2.setAttri bute("type","te xt")
    input2.setAttri bute("readOnly" ,"false")
    input2.setAttri bute("size","32 ")

    input3 = document.create Element("input" );
    input3.setAttri bute("name","x" )
    input3.setAttri bute("value","" )
    input3.setAttri bute("type","te xt")
    input3.setAttri bute("readOnly" ,"false")
    input3.setAttri bute("size","8" )
    input3.setAttri bute("maxlength ","10")


    link = document.create Element('a');
    link.href="java script:
    show_calendar(' document.form1. date',document. form1.date.valu e);"
    img = document.create Element('img');
    img.setAttribut e("border","0") ;
    img.setAttribut e("height","16" );
    img.setAttribut e("width","16") ;
    img.setAttribut e("src","H:Dive rse\\cal.gif");
    img.setAttribut e("alt","Tryk k her for å få opp kalender");

    link.appendChil d(img);

    input4 = document.create Element("input" );
    input4.setAttri bute("name","fr a_dato")
    input4.setAttri bute("value","" )
    input4.setAttri bute("type","te xt")
    input4.setAttri bute("readOnly" ,"false")
    input4.setAttri bute("size","15 ")
    input4.onclick = function(){ alert(input3.na me) };

    input5 = document.create Element("input" );
    input5.setAttri bute("name","d" +index)
    input5.setAttri bute("value","" )
    input5.setAttri bute("type","te xt")
    input5.setAttri bute("size","8" )

    var td1 = document.create Element("TD")
    td1.appendChild (input1)

    var td2 = document.create Element("TD")
    td2.appendChild (input2)

    var td3 = document.create Element("TD")
    td3.appendChild (input3)
    td3.appendChild (link)

    var td4 = document.create Element("TD")
    td4.appendChild (input4)

    var td5 = document.create Element("TD")
    td5.appendChild (input5)

    row.appendChild (td1);
    row.appendChild (td2);
    row.appendChild (td3);
    row.appendChild (td4);
    row.appendChild (td5);
    tbody.appendChi ld(row);

    //increase index of hidden field
    index++
    document.form1. hidden.value=in dex
    }
    </script>
    <script src="H:\Diverse \ts_picker.js"> </script>
    </head>

    <body>
    <form name="form1">
    <input type="hidden" value="0" name="hidden">
    <table id="myTable" cellspacing="0" border="1">
    <tr>
    <td>&nbsp;<sele ct size="1" name="havnkode" id="select"> <option
    value="02">Drop down</option><option value="00">Test 1</option>
    </td>
    <td><input name="fra_dato" size="8" type="text" value=""
    maxlength="10" readonly><a
    href="javascrip t:show_calendar ('document.form 1.fra_dato');">
    <img src="H:Diverse\ cal.gif" width="16" height="16" border="0"
    alt="Trykk her for å få opp kalender"></a></td>
    <td>row1_column 1</td>
    </tr>
    </table>
    <input type="button" value="new row"
    onClick="javasc ript:addRow('my Table')">
    </body>
    </form>
    </html>

    -------------------------------------------------------------------------------

    This is the calendar function , ive saved it as ts_picker.js :

    -------------------------------------------------------------------------------

    function show_calendar(s tr_target, str_datetime) {

    var arr_months = ["January", "February", "March", "April", "May",
    "June",
    "July", "August", "September" , "October", "November", "December"];
    var week_days = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
    var n_weekstart = 1; // day week starts from (normally 0 or 1)

    var dt_datetime = (str_datetime == null || str_datetime =="" ? new
    Date() : str2dt(str_date time));
    var dt_prev_month = new Date(dt_datetim e);
    dt_prev_month.s etMonth(dt_date time.getMonth()-1);
    var dt_next_month = new Date(dt_datetim e);
    dt_next_month.s etMonth(dt_date time.getMonth() +1);
    var dt_firstday = new Date(dt_datetim e);
    dt_firstday.set Date(1);
    dt_firstday.set Date(1-(7+dt_firstday. getDay()-n_weekstart)%7) ;
    var dt_lastday = new Date(dt_next_mo nth);
    dt_lastday.setD ate(0);

    // html generation (feel free to tune it for your particular
    application)
    // print calendar header
    var str_buffer = new String (
    "<html>\n"+
    "<head>\n"+
    " <title>Kalender </title>\n"+
    "</head>\n"+
    "<body bgcolor=\"White \">\n"+
    "<table class=\"clsOTab le\" cellspacing=\"0 \" border=\"0\"
    width=\"100%\"> \n"+
    "<tr><td bgcolor=\"#4682 B4\">\n"+
    "<table cellspacing=\"1 \" cellpadding=\"3 \" border=\"0\"
    width=\"100%\"> \n"+
    "<tr>\n <td bgcolor=\"#4682 B4\"><a
    href=\"javascri pt:window.opene r.show_calendar ('"+
    str_target+"', '"+
    dt2dtstr(dt_pre v_month)+"'+doc ument.cal.time. value);\">"+
    "<img src=\"prev.gif\ " width=\"16\" height=\"16\" border=\"0\""+
    " alt=\"previous month\"></a></td>\n"+
    " <td bgcolor=\"#4682 B4\" colspan=\"5\">" +
    "<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">"
    +arr_months[dt_datetime.get Month()]+"
    "+dt_datetime.g etFullYear()+"</font></td>\n"+
    " <td bgcolor=\"#4682 B4\" align=\"right\" ><a
    href=\"javascri pt:window.opene r.show_calendar ('"
    +str_target+"', '"+dt2dtstr(dt_ next_month)+"'+ document.cal.ti me.value);\">"+
    "<img src=\"next.gif\ " width=\"16\" height=\"16\" border=\"0\""+ "
    alt=\"next month\"></a></td>\n</tr>\n"
    );

    var dt_current_day = new Date(dt_firstda y);
    // print weekdays titles
    str_buffer += "<tr>\n";
    for (var n=0; n<7; n++)
    str_buffer += " <td bgcolor=\"#87CE FA\">"+
    "<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">"+
    week_days[(n_weekstart+n) %7]+"</font></td>\n";
    // print calendar table
    str_buffer += "</tr>\n";
    while (dt_current_day .getMonth() == dt_datetime.get Month() ||
    dt_current_day. getMonth() == dt_firstday.get Month()) {
    // print row heder
    str_buffer += "<tr>\n";
    for (var n_current_wday= 0; n_current_wday< 7; n_current_wday+ +) {
    if (dt_current_day .getDate() == dt_datetime.get Date() &&
    dt_current_day. getMonth() == dt_datetime.get Month())
    // print current date
    str_buffer += " <td bgcolor=\"#FFB6 C1\" align=\"right\" >";
    else if (dt_current_day .getDay() == 0 || dt_current_day. getDay()
    == 6)
    // weekend days
    str_buffer += " <td bgcolor=\"#DBEA F5\" align=\"right\" >";
    else
    // print working days of current month
    str_buffer += " <td bgcolor=\"white \" align=\"right\" >";

    if (dt_current_day .getMonth() == dt_datetime.get Month())
    // print days of current month
    str_buffer += "<a href=\"javascri pt:window.opene r."+str_targe t+
    ".value='"+dt2d tstr(dt_current _day)+"'+docume nt.cal.time.val ue;
    window.close(); \">"+
    "<font color=\"black\" face=\"tahoma, verdana\" size=\"2\">";
    else
    // print days of other months
    str_buffer += "<a href=\"javascri pt:window.opene r."+str_targe t+
    ".value='"+dt2d tstr(dt_current _day)+"'+docume nt.cal.time.val ue;
    window.close(); \">"+
    "<font color=\"gray\" face=\"tahoma, verdana\" size=\"2\">";
    str_buffer += dt_current_day. getDate()+"</font></a></td>\n";
    dt_current_day. setDate(dt_curr ent_day.getDate ()+1);
    }
    // print row footer
    str_buffer += "</tr>\n";
    }
    // print calendar footer
    str_buffer +=
    "<form name=\"cal\">\n <tr><td colspan=\"7\" bgcolor=\"#87CE FA\">"+
    "<font color=\"White\" face=\"tahoma, verdana\" size=\"2\">"+
    "<input type=\"hidden\" name=\"time\"
    value=\""+dt2tm str(dt_datetime )+
    "\" size=\"8\" maxlength=\"8\" ></font></td></tr>\n</form>\n" +
    "</table>\n" +
    "</tr>\n</td>\n</table>\n" +
    "</body>\n" +
    "</html>\n";

    var vWinCal = window.open("", "Calendar",
    "width=200,heig ht=210,status=n o,resizable=yes ,top=200,left=3 50");
    vWinCal.opener = self;
    var calc_doc = vWinCal.documen t;
    calc_doc.write (str_buffer);
    calc_doc.close( );
    }

    function str2dt (str_datetime) {
    var re_date = /^(\d+)\.(\d+)\. (\d+)\s+(\d+)\: (\d+)\:(\d+)$/;
    if (!re_date.exec( str_datetime))
    return alert("Invalid Datetime format: "+ str_datetime);
    return (new Date (RegExp.$3, RegExp.$2-1, RegExp.$1, RegExp.$4,
    RegExp.$5, RegExp.$6));
    }
    function dt2dtstr (dt_datetime) {
    return (new String (
    dt_datetime.get Date()+"."+(dt_ datetime.getMon th()+1)+"."+dt_ datetime.getFul lYear()+"
    "));
    }
    function dt2tmstr (dt_datetime) {
    return (new String ("\t\t"
    +dt_datetime.ge tHours()+":"+dt _datetime.getMi nutes()+":"+dt_ datetime.getSec onds()));
    }

    --------------------------------------------------------------------------------

    Comment

    • Dr John Stockton

      #3
      Re: Need help with a link

      JRS: In article <5bd31089.03090 20004.10da56fb@ posting.google. com>, seen
      in news:comp.lang. javascript, timmy_dale12@ho tmail.com posted at Tue, 2
      Sep 2003 01:04:17 :-
      [color=blue]
      > var dt_next_month = new Date(dt_datetim e);
      > dt_next_month.s etMonth(dt_date time.getMonth() +1);[/color]

      If dt_datetime is new Date(2003, 7, 31), Aug 31, then dt_next_month will
      become October 1st.

      And, of course, according to Fred Hoyle, "October the First is Too Late"
      (a book title).

      If, in incrementing/decrementing the Month, the Date needs to be set to
      1<=D<=28, then do the latter first.

      --
      © John Stockton, Surrey, UK. ?@merlyn.demon. co.uk Turnpike v4.00 MIME. ©
      Web <URL:http://www.merlyn.demo n.co.uk/> - w. FAQish topics, links, acronyms
      PAS EXE etc : <URL:http://www.merlyn.demo n.co.uk/programs/> - see 00index.htm
      Dates - miscdate.htm moredate.htm js-dates.htm pas-time.htm critdate.htm etc.

      Comment

      • Lasse Reichstein Nielsen

        #4
        Re: Need help with a link

        Dr John Stockton <spam@merlyn.de mon.co.uk> writes:
        [color=blue]
        > If, in incrementing/decrementing the Month, the Date needs to be set to
        > 1<=D<=28, then do the latter first.[/color]

        Then you have to test for that, which requires knowing the lengths of
        months. I believe the Date object knows those better than me. :)

        You can set the month first, check if it worked, and if not, set the
        date back.

        // "date" is the date we want to add a month to

        var mth = date.getMonth() ;
        date.setMonth(m th+1);
        if (date.getMonth( ) != mth+1) { //overflow
        date.setDate(0) ; // day before 1st
        }

        With this code, the 28th through 31th of January this year are all
        sent to the 28th of February.

        /L
        --
        Lasse Reichstein Nielsen - lrn@hotpop.com
        Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit. html>
        'Faith without judgement merely degrades the spirit divine.'

        Comment

        • timmy_dale12@hotmail.com

          #5
          Re: Need help with a link

          Lasse Reichstein Nielsen <lrn@hotpop.com > wrote in message news:<ekyyiy6p. fsf@hotpop.com> ...[color=blue]
          > Dr John Stockton <spam@merlyn.de mon.co.uk> writes:
          >[color=green]
          > > If, in incrementing/decrementing the Month, the Date needs to be set to
          > > 1<=D<=28, then do the latter first.[/color]
          >
          > Then you have to test for that, which requires knowing the lengths of
          > months. I believe the Date object knows those better than me. :)
          >
          > You can set the month first, check if it worked, and if not, set the
          > date back.
          >
          > // "date" is the date we want to add a month to
          >
          > var mth = date.getMonth() ;
          > date.setMonth(m th+1);
          > if (date.getMonth( ) != mth+1) { //overflow
          > date.setDate(0) ; // day before 1st
          > }
          >
          > With this code, the 28th through 31th of January this year are all
          > sent to the 28th of February.
          >
          > /L[/color]


          Well first i have to get this link to work for each pasted row. This
          is my real problem. Has anyone got a solution to this ?

          Tim

          Comment

          • Grant Wagner

            #6
            Re: Need help with a link

            timmy_dale12@ho tmail.com wrote:
            [color=blue][color=green]
            > > Not without knowing the structure of your page.[/color]
            >
            > Okay here it comes.
            >
            > This is the main script, ive put it in a html page to illustrate how
            > it works :[/color]

            In Internet Explorer NAMEd form elements are not part of the document.forms[].elements[] collection. This can be
            demonstrated very simply with:

            <body onload="createI nput();alert(do cument.forms['myForm'].elements['abc'].value);">
            <form name="myForm">
            </form>
            <script type="text/javascript">
            function createInput() {
            var input2 = document.create Element("input" );
            // input2.setAttri bute("id", "abc");
            input2.setAttri bute("name","ab c");
            input2.setAttri bute("value","" );
            input2.setAttri bute("type","te xt");
            input2.setAttri bute("readOnly" ,"false");
            input2.setAttri bute("size","32 ");

            document.forms['myForm'].appendChild(in put2);
            }
            </script>
            </body>

            If you uncomment "input2.setAttr ibute("id", "abc")" then you can access the form element via either
            document.forms[].elements['abc'] or document.getEle mentById('abc') in IE 5.5+, Mozilla and Opera 7.

            --
            | Grant Wagner <gwagner@agrico reunited.com>

            * Client-side Javascript and Netscape 4 DOM Reference available at:
            * http://devedge.netscape.com/library/...ce/frames.html
            * Internet Explorer DOM Reference available at:
            * http://msdn.microsoft.com/workshop/a...ence_entry.asp
            * Netscape 6/7 DOM Reference available at:
            * http://www.mozilla.org/docs/dom/domref/
            * Tips for upgrading JavaScript for Netscape 7 / Mozilla
            * http://www.mozilla.org/docs/web-deve...upgrade_2.html


            Comment

            • Dr John Stockton

              #7
              Re: Need help with a link

              JRS: In article <ekyyiy6p.fsf@h otpop.com>, seen in
              news:comp.lang. javascript, Lasse Reichstein Nielsen <lrn@hotpop.com >
              posted at Wed, 3 Sep 2003 01:10:38 :-[color=blue]
              >Dr John Stockton <spam@merlyn.de mon.co.uk> writes:
              >[color=green]
              >> If, in incrementing/decrementing the Month, the Date needs to be set to
              >> 1<=D<=28, then do the latter first.[/color]
              >
              >Then you have to test for that, which requires knowing the lengths of
              >months. I believe the Date object knows those better than me. :)[/color]

              I believe that you have misunderstood what I wrote.

              To go from a random date to the 1st..28th of next month, one can always
              go first to the 1st..28th of the current month, and incrementing the
              month then cannot affect the date.

              [color=blue]
              >You can set the month first, check if it worked, and if not, set the
              >date back.
              >
              > // "date" is the date we want to add a month to
              >
              > var mth = date.getMonth() ;
              > date.setMonth(m th+1);
              > if (date.getMonth( ) != mth+1) { //overflow
              > date.setDate(0) ; // day before 1st
              > }
              >
              >With this code, the 28th through 31th of January this year are all
              >sent to the 28th of February.[/color]

              That is, of course, good for getting to the last of a month. Except at
              the end of the year, when the != is false. One should check instead to
              see whether the getDate() gives what it gave before or use (mth+1)%12.

              <URL:http://www.merlyn.demo n.co.uk/js-date1.htm#MC>
              <URL:http://www.merlyn.demo n.co.uk/js-date2.htm#incr>

              IIRC, setDate(0) may fail to give the last of the previous month in
              Macintosh Netscape 4 - does anyone know? See, using Mac NS4, the second
              in Bug Tests under <URL:http://www.merlyn.demo n.co.uk/js-dates.htm#SDT>.

              --
              © John Stockton, Surrey, UK. ?@merlyn.demon. co.uk Turnpike v4.00 IE 4 ©
              <URL:http://jibbering.com/faq/> Jim Ley's FAQ for news:comp.lang. javascript
              <URL:http://www.merlyn.demo n.co.uk/js-index.htm> JS maths, dates, sources.
              <URL:http://www.merlyn.demo n.co.uk/> TP/BP/Delphi/JS/&c., FAQ topics, links.

              Comment

              • Lasse Reichstein Nielsen

                #8
                Re: Need help with a link

                Dr John Stockton <spam@merlyn.de mon.co.uk> writes:
                [color=blue]
                > I believe that you have misunderstood what I wrote.[/color]

                It seems I did. What I was trying to hit, was the same date in the
                next month, or the last day of the next month if that date doesn't
                exist.
                [color=blue]
                > To go from a random date to the 1st..28th of next month, one can always
                > go first to the 1st..28th of the current month, and incrementing the
                > month then cannot affect the date.[/color]

                That will work.

                What makes Date objects so much fun is, that when changing it from
                one arbitrary date to another, using setMonth and setDate, then there
                is no order that always work.

                date first mth first
                Feb 2nd => Jan 31th Jan 3rd Jan 31th
                Jan 31th => Feb 2nd Feb 2nd Mar 2nd

                It is safest to set either date or month to a safe value (e.g., 1 for
                day or 0 for month) and then set the desired month and date in any
                order.
                [color=blue]
                > That is, of course, good for getting to the last of a month. Except at
                > the end of the year, when the != is false.[/color]

                DOH! There is always something :)

                /L
                --
                Lasse Reichstein Nielsen - lrn@hotpop.com
                Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit. html>
                'Faith without judgement merely degrades the spirit divine.'

                Comment

                • Dr John Stockton

                  #9
                  Re: Need help with a link

                  JRS: In article <r82x39kk.fsf@h otpop.com>, seen in
                  news:comp.lang. javascript, Lasse Reichstein Nielsen <lrn@hotpop.com >
                  posted at Wed, 3 Sep 2003 22:23:39 :-[color=blue]
                  >
                  >It is safest to set either date or month to a safe value (e.g., 1 for
                  >day or 0 for month) and then set the desired month and date in any
                  >order.
                  >[/color]

                  FAQ readers should know that trick, indirectly. It is a pity that the
                  routines which set Y M & D cannot have, as those which set h m & s have,
                  additional parameters to set lesser fields. Or rather, on checking the
                  old NS JS documentation and ECMA, it is a pity that it is not better
                  known that they do. Requires JS 1.3, which probably everyone has by
                  now?

                  Watch out also for the non-existence, within the EU, of one hour of
                  civil time on the last Sunday of March, at 01:00 GMT (possibly UTC in
                  some countries).

                  // 'cannot' != 'can not' // for long > -30

                  --
                  © John Stockton, Surrey, UK. ?@merlyn.demon. co.uk Turnpike v4.00 IE 4 ©
                  <URL:http://jibbering.com/faq/> Jim Ley's FAQ for news:comp.lang. javascript
                  <URL:http://www.merlyn.demo n.co.uk/js-index.htm> JS maths, dates, sources.
                  <URL:http://www.merlyn.demo n.co.uk/> TP/BP/Delphi/JS/&c., FAQ topics, links.

                  Comment

                  Working...