Avatar billede reb Nybegynder
02. december 2004 - 15:54 Der er 7 kommentarer og
1 løsning

Tilpasning af datepicker.

Hej Javascript-nørder.

Jeg har "lånt" dette script, som er en date picker, som returnere en dato ind i et formularfelt. Jeg vil nu gerne have, at når der bliver klikket på en dato i pop, skal den side, som åbnende pickeren kaldes igen (det er en asp-side), med dato som parameter. Er ikke den store ørn til javascript, så jeg tænkte om der var nogen, som kunne komme lidt input, eller tilretning, så jeg får løst mit problem.  Her er mit "lånte" script.
Beklager på forhånd, hvis det er for meget vedlagt tekst.

------kode--START----
// Title: Timestamp picker
// Description: See the demo at url
// URL: http://us.geocities.com/tspicker/
// Script featured on: http://javascriptkit.com/script/script2/timestamp.shtml
// Version: 1.0
// Date: 12-05-2001 (mm-dd-yyyy)
// Author: Denis Gritcyuk <denis@softcomplex.com>; <tspicker@yahoo.com>
// Notes: Permission given to use this script in any kind of applications if
//    header lines are left unchanged. Feel free to contact the author
//    for feature requests and/or donations

function show_calendar(str_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_datetime));
    var dt_prev_month = new Date(dt_datetime);
    dt_prev_month.setMonth(dt_datetime.getMonth()-1);
    var dt_next_month = new Date(dt_datetime);
    dt_next_month.setMonth(dt_datetime.getMonth()+1);
    var dt_firstday = new Date(dt_datetime);
    dt_firstday.setDate(1);
    dt_firstday.setDate(1-(7+dt_firstday.getDay()-n_weekstart)%7);
    var dt_lastday = new Date(dt_next_month);
    dt_lastday.setDate(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>Calendar</title>\n"+
        "</head>\n"+
        "<body bgcolor=\"White\">\n"+
        "<table class=\"clsOTable\" cellspacing=\"0\" border=\"0\" width=\"100%\">\n"+
        "<tr><td bgcolor=\"#4682B4\">\n"+
        "<table cellspacing=\"1\" cellpadding=\"3\" border=\"0\" width=\"100%\">\n"+
        "<tr>\n    <td bgcolor=\"#4682B4\"><a href=\"java script:window.opener.show_calendar('"+
        str_target+"', '"+ dt2dtstr(dt_prev_month)+"'+document.cal.time.value);\">"+
        "<img src=\"prev.gif\" width=\"16\" height=\"16\" border=\"0\""+
        " alt=\"previous month\"></a></td>\n"+
        "    <td bgcolor=\"#4682B4\" colspan=\"5\">"+
        "<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">"
        +arr_months[dt_datetime.getMonth()]+" "+dt_datetime.getFullYear()+"</font></td>\n"+
        "    <td bgcolor=\"#4682B4\" align=\"right\"><a href=\"java script:window.opener.show_calendar('"
        +str_target+"', '"+dt2dtstr(dt_next_month)+"'+document.cal.time.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_firstday);
    // print weekdays titles
    str_buffer += "<tr>\n";
    for (var n=0; n<7; n++)
        str_buffer += "    <td bgcolor=\"#87CEFA\">"+
        "<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.getMonth() ||
        dt_current_day.getMonth() == dt_firstday.getMonth()) {
        // 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.getDate() &&
                    dt_current_day.getMonth() == dt_datetime.getMonth())
                    // print current date
                    str_buffer += "    <td bgcolor=\"#FFB6C1\" align=\"right\">";
                else if (dt_current_day.getDay() == 0 || dt_current_day.getDay() == 6)
                    // weekend days
                    str_buffer += "    <td bgcolor=\"#DBEAF5\" align=\"right\">";
                else
                    // print working days of current month
                    str_buffer += "    <td bgcolor=\"white\" align=\"right\">";

                if (dt_current_day.getMonth() == dt_datetime.getMonth())
                    // print days of current month
                    str_buffer += "<a href=\"java script:window.opener."+str_target+
                    ".value='"+dt2dtstr(dt_current_day)+"'+document.cal.time.value; window.close();\">"+
                    "<font color=\"black\" face=\"tahoma, verdana\" size=\"2\">";
                else
                    // print days of other months
                    str_buffer += "<a href=\"java script:window.opener."+str_target+
                    ".value='"+dt2dtstr(dt_current_day)+"'+document.cal.time.value; 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_current_day.getDate()+1);
        }
        // print row footer
        str_buffer += "</tr>\n";
    }
    // print calendar footer
    str_buffer +=
        "<form name=\"cal\">\n<tr><td colspan=\"7\" bgcolor=\"#87CEFA\">"+
        "<font color=\"White\" face=\"tahoma, verdana\" size=\"2\">"+
        "Time: <input type=\"text\" name=\"time\" value=\""+dt2tmstr(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,height=250,status=no,resizable=yes,top=200,left=200");
    vWinCal.opener = self;
    var calc_doc = vWinCal.document;
    calc_doc.write (str_buffer);
    calc_doc.close();
}
// datetime parsing and formatting routimes. modify them if you wish other datetime format
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.getDate()+"-"+(dt_datetime.getMonth()+1)+"-"+dt_datetime.getFullYear()+" "));
}
function dt2tmstr (dt_datetime) {
    return (new String (
            dt_datetime.getHours()+":"+dt_datetime.getMinutes()+":"+dt_datetime.getSeconds()));
}

---------------KODE SLUT-------------
mvh
Rene´
Avatar billede roenving Novice
02. december 2004 - 16:15 #1
Måske sådan ?-)

      // 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.getDate() &&
                    dt_current_day.getMonth() == dt_datetime.getMonth())
                    // print current date
                    str_buffer += "    <td bgcolor=\"#FFB6C1\" align=\"right\">";
                else if (dt_current_day.getDay() == 0 || dt_current_day.getDay() == 6)
                    // weekend days
                    str_buffer += "    <td bgcolor=\"#DBEAF5\" align=\"right\">";
                else
                    // print working days of current month
                    str_buffer += "    <td bgcolor=\"white\" align=\"right\">";

                if (dt_current_day.getMonth() == dt_datetime.getMonth())
                    // print days of current month
                    str_buffer += "<a href=\"java script:window.opener.location.href+='?date='+escape('"+
                    dt2dtstr(dt_current_day)+"+document.cal.time.value+"')"; window.close();\">"+
                    "<font color=\"black\" face=\"tahoma, verdana\" size=\"2\">";
                else
                    // print days of other months
                    str_buffer += "<a href=\"java script:window.opener.location.href+='?date='+escape('"+
                    dt2dtstr(dt_current_day)+"+document.cal.time.value+"')"; 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_current_day.getDate()+1);
        }
        // print row footer
Avatar billede olebole Juniormester
02. december 2004 - 16:27 #2
<ole>

Hvis vi konkatenerer href'en med en query-streng, går det galt i andet forsøg. Så vil vi jo få to query-strenge i URI'en. Jeg ville nok prøve med:

    if (dt_current_day.getMonth() == dt_datetime.getMonth())
        // print days of current month
        str_buffer += "<a href=\"java script:window.opener.location"+
        ".href='DIT_DOKUMENT.ASP?tid="+escape(dt2dtstr(dt_current_day)+" "+document.cal.time.value)+"'; window.close();\">"+
        "<font color=\"black\" face=\"tahoma, verdana\" size=\"2\">";
    else
        // print days of other months
        str_buffer += "<a href=\"java script:window.opener.location"+
        ".href='DIT_DOKUMENT.ASP?tid="+escape(dt2dtstr(dt_current_day)+" "+document.cal.time.value)+"'; 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_current_day.getDate()+1);


/mvh
</bole>
Avatar billede olebole Juniormester
02. december 2004 - 16:29 #3
... der er vist også lidt rod i gåseøjnene omkring din escape, roenving  :)
Avatar billede reb Nybegynder
03. december 2004 - 08:22 #4
roenving>> Din koder melder om fejl i linie 82: Strengkonstanten er uafsluttet.

olebole>> Din kode melder om fejl i linie 86: document.cal.time er null eller ikke et objekt.

Hvad gør jeg anderledes ? Skal lige sige, at jeg ikke skal bruge tiden til noget, kun datoen, så den del kan jeg for så vidt godt undvære.

mvh
Rene´
Avatar billede reb Nybegynder
03. december 2004 - 13:20 #5
Har løst problemet, med roenving´s . Nu virker det. Det er jo nærmest til at få tårer i øjnene af, hvis man altså var født med kvindelige kønshormoner :-)

Tak for hjælpen, og smid lige et svar.

mvh
Rene´
Avatar billede olebole Juniormester
03. december 2004 - 17:54 #6
Hehe .... ja, du må jo selv sørge for, at 'document.cal.time' eksisterer, når scriptet kaldes. Det kan jeg jo ikke gøre for dig  ;o)
Avatar billede roenving Novice
05. december 2004 - 08:16 #7
Velbekomme '-)
Avatar billede roenving Novice
10. december 2004 - 12:19 #8
-- og tak for point ;~}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester