ASP.NET Zone

Hallo,

ich hab hier das Problem dass ich nicht weiss wie ich Variablen von JavaScript in meine C# CodeBehind-Methoden bekomme.

Google hat mir gesagt das ich das mit Hidden-Elementen machen kann was ich aber nicht so richtig verstanden habe.

Wie kann ich das Problem denn am besten lösen?

Könnte ich eigentlich auch alles nur mit JavaScript machen und C# weglassen?

Mein Projekt besteht aus einigen Berechnungen (durch eingegebene Werte in Textboxes, DateTimePicker,...) die dann zum Schluss formatiert und druckfertg in einem PDF zusammengefasst werden sollen.

Vielen dank schon mal für eure Hilfe

Mfg

Tobi

Blitz:

ich hab hier das Problem dass ich nicht weiss wie ich Variablen von JavaScript in meine C# CodeBehind-Methoden bekomme.

Das Problem ist nicht wie man sie von der Javascript- in die Codebehind Datei bekommt, sondern wie man sie vom Client (einem Browser irgendwo auf der Welt) zum Server (einem Webserver irgendwoanders auf der Welt) bekommt ;-)

Blitz:

Google hat mir gesagt das ich das mit Hidden-Elementen machen kann was ich aber nicht so richtig verstanden habe.

Google hat mal wieder Recht. HiddenFields sind eine Möglichkeit. Das sind Controls die der User nicht sieht, die man aber vom Client(JavaScript) und vom Server(falls runat=server) ansprechen kann. Außerdem implementieren sie IPostBackDataHandler, man kriegt also auf dem server mit wenn was clientseitig geändert wurde.

Blitz:

Wie kann ich das Problem denn am besten lösen?

Einfach ein Hiddenfield auf der Seite deklarieren, eine ID vergeben, per document.getElementById (oder jQuery) die Referenz auf das Control bekommen, den Wert dort ablegen(hiddenField1.value="irgendwas";) und auf dem Server auslesen(String value = hiddenField1.Value;).

Blitz:

Könnte ich eigentlich auch alles nur mit JavaScript machen und C# weglassen?

Ja, dann wärs aber keine Webanwendung mehr sondern eine HTML Seite die man sich lokal im Browser angucken kann ;)

Blitz:

Mein Projekt besteht aus einigen Berechnungen (durch eingegebene Werte in Textboxes, DateTimePicker,...) die dann zum Schluss formatiert und druckfertg in einem PDF zusammengefasst werden sollen.

---

Gruß

Also ich hab hier mal einen DateTimePicker:

<script type="text/javascript">

$(document).ready(function () {

$(function () {

var dates = $("#ArrivalStartDatepicker, #ArrivalEndDatepicker").datetimepicker(

{

defaultDate: "+lw",

dateFormat: 'dd-mm-yy',

changeMonth: true,

numberOfMonths: 2,

ampm: true,

stepMinute: 10,

minuteGrid: 10,

weekHeader: "W",

onSelect: function (selectedDate)

{

var option = this.id == "ArrivalStartDatepicker" ? "minDate" : "maxDate",

instance = $(this).data("datetimepicker"),

date = $.datetimepicker.parseDate(

instance.settings.dateFormat ||

$.datetimepicker._defaults.dateFormat,

selectedDate, instance.settings);

dates.not(this).datetimepicker("option", option, date);

document.getElementById("ArrivalStart").value = dates;



}

});



});

});



Ich hab dieses Hidden-Field in meiner .aspx:
<div>

<input type="hidden" id="ArrivalStart" runat="server"/>

</div>

und hier noch den TestButton der den Inhalt der Variablen testweise in ein Label schreibt, dass ich sehe was denn überhaupt in dieser Variablen enthalten ist:

protected void Button1_Click(object sender, EventArgs e)

{

TotalLabel.Text = Convert.ToString(ArrivalStart.Value);

}

wie bekomme ich jetzt das Datum und die Zeit die gewählt wurde zum Server um sie dann eben mit C# weiter zu verarbeiten (Differenz zwischen den Tagen berechnen,...)?

Mfg

Tobi

So wie ich das sehe hast Du doch schon alles. Was funktioniert nicht?

---

Gruß

nach einem klick auf den button lädt die seite neu und der Wert des Labeltextes ist leer.

Blitz:

nach einem klick auf den button lädt die seite neu und der Wert des Labeltextes ist leer.

Dann würde ich als erstes mal das javascript debuggen. Kann es sein dass du dem hiddenfield.value den datetimepicker zuweist anstatt dem Datum? Dann müsste das hier richtig sein:

document.getElementById("ArrivalStart").value = date; (date anstatt dates)

---

Gruß

kommt das gleiche ergebnis raus wie mit dem S

nach dem ich auf den button geklickt habe wird eben die seite neu geladen und alle felder die ich ausgefüllt habe sind dannach leer.


Ausserdem wird z.b. das Accordion das ich noch habe in dem diese Datepicker und Textboxes sind, geschlosssen bis auf das erste AccordionPane. es geht also in den grundzustand zurück.

mfg

tobi

Blitz:

kommt das gleiche ergebnis raus wie mit dem S
nach dem ich auf den button geklickt habe wird eben die seite neu geladen und alle felder die ich ausgefüllt habe sind dannach leer.
Ausserdem wird z.b. das Accordion das ich noch habe in dem diese Datepicker und Textboxes sind, geschlosssen bis auf das erste AccordionPane. es geht also in den grundzustand zurück.

Wie gesagt, debugge erstmal das javascript und schaue ob da alles funktioniert. Ich vermute nämlich dass ein du einen javascript Fehler hast der den asynchronen Postback verhindert und dadurch die Seite nicht als Postback lädt.

Wird denn der Button-Click handler auf dem Server aufgerufen wenn du da einen Haltepunkt setzt?

---

Gruß

ja wenn ich einen breakpoint setze wird der auch aufgerufen wenn ich auf den button klicke.

und der wert ist dann erst "Total" (default wert) und dann wird er auf "" gesetzt.

kann ich JS-Code mit visual-Studio debuggen.

sorry für die frage aber ich hab vorher noch nie was mit Js gemacht.

mfg

tobi

EDIT:

OK ich weiss jetzt auch wie man das debuggt :-)

das erste was mir der IE rausspuckt ist dieser Fehler "Jquery ist undefiniert"

aber ich hab es ja eingebunden:

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="GH.aspx.cs" Inherits="asp_test_gbc.GH" MaintainScrollPositionOnPostback="True"%>




<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">

<link href="css/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

</script src="JS/jquery-1.7.1.js" type="text/javascript">

</script src="JS/jquery-1.7.1.min.js" type="text/javascript">

</script src="JS/jquery-ui-1.8.18.custom.min.js" type="text/javascript">

<asp:DropDownList ID="SubsidiaryCalcDropDownList" runat="server"

das sollte doch so reichen oder?

mfg

Tobi

Ich hab jetzt die neuesten JQuery dateien eingebunden und der Fehler "JQuery ist undefiniert" ist weg.

JQuery UI 1.8.20

jetzt hab ich aber noch einen anderen fehler:

"$.datetimepicker is undefined" im Firefox 11.0
"Laufzeitfehler in Microsoft BLOCKED SCRIPT '$.datetimepicker' ist Null oder kein Objekt" in Visual Studio 2010

wie kann ich den denn beheben?

Mfg

Tobi

weiss keiner woran das liegen könnte?

mfg

tobi

ich hab jetzt mal diesen Code um den datetimepicker zu erstellen:

var dates = $("#ArrivalStartDatepicker").datetimepicker({

defaultDate: "+lw",

dateFormat: 'dd-mm-yy',

changeMonth: true,

numberOfMonths: 2,

ampm: true,

stepMinute: 10,

minuteGrid: 10,

onSelect: function (selectedDate) {

// var option = this.id == "ArrivalStartDatepicker" ? "minDate" : "maxDate",

// instance = $(this).data("datetimepicker"),

document.getElementById("TotalLabel").value = $.datetimepicker.parseDate('yy-mm-dd', '2012-05-23');

// instance.settings.dateFormat ||

// $.datetimepicker._defaults.dateFormat,

// selectedDate, instance.settings);

// dates.not(this).datetimepicker("option", option, date);

// document.getElementById("TotalLabel").value = date;

}

});

der datetimepicker wird auch wunderbar auf der seite angezeigt, nur wenn ich jetzt entweder die zeit verändere oder einen Tag im kalender auswähle dann bringt mir Firebug diese Meldung:

$.datetimepicker is undefined

und der debugger stoppt bei der dieser Zeile:

document.getElementById("TotalLabel").value = $.datetimepicker.parseDate('yy-mm-dd', '2012-05-23');

kann mir jetzt vielleicht jemand helfen?

mfg

tobi

Hi,

Blitz:

ich hab jetzt mal diesen Code um den datetimepicker zu erstellen:

das ist mir jetzt erst aufgefallen: datetimepicker ist kein Bestandteil von jQueryUI, da gibt es nur datepicker. Für das datetimepicker Plugin musst Du noch die entsprechende JavaScript Datei einbinden. Siehe:

  http://stackoverflow.com/questions/9125882/setting-up-the-datetime-picker

---

--
Gruß, Stefan Falz
Microsoft MVP - Visual Developer ASP/ASP.NET
ASP.NET Consulting, Development, Coaching

ASP.NET Zone - Leitfaden für gute Postings

Xtopia 2008 - Gewinnspiel / Expression Studio und Xtopia Eintrittskarten zu gewinnen

die hab ich auch drin. hab die von dieser seite

http://trentrichardson.com/examples/timepicker/

das eigenartige daran ist ja das mir der datetimepicker auf meiner seite richtig angezeigt wird mit kalender und den slidern für die zeit aber wenn ich etwas auswähle dann kommt eben die beschriebene fehlermeldung.

nach dem ich etwas ausgewählt habe wird das datum und die zeit auch in dem input-eleent angezeigt aber ich kann eben nicht darauf zugreifen um den wert zu verwenden.

mfg

tobi

hab jetzt mein problem gefunden:

es lag daran das die parseDate methode eine Methode von jquery und nicht von dem datetimepicker ist:

falsch:

$(document).ready(function () {


$(function () {


var dates = $("#ArrivalStartDatepicker, #ArrivalEndDatepicker").datetimepicker(


{


defaultDate: "+lw",


dateFormat: 'dd-mm-yy',


changeMonth: true,


numberOfMonths: 2,


ampm: true,


stepMinute: 10,


minuteGrid: 10,


weekHeader: "W",


onSelect: function (selectedDate)


{


date = $.datetimepicker.parseDate(


instance.settings.dateFormat ||


$.datetimepicker._defaults.dateFormat,


selectedDate, instance.settings);


dates.not(this).datetimepicker("option", option, date);


document.getElementById("ArrivalStart").value = dates;





}


});





});


});

richtig:

$(document).ready(function () {

$(function () {

var dates = $("#ArrivalStartDatepicker, #ArrivalEndDatepicker").datetimepicker(

{

defaultDate: "+lw",

dateFormat: 'dd-mm-yy',

changeMonth: true,

numberOfMonths: 2,

ampm: true,

stepMinute: 10,

minuteGrid: 10,

weekHeader: "W",

onSelect: function (selectedDate)

{


date = $.datepicker.parseDate(

instance.settings.dateFormat ||

$.datetimepicker._defaults.dateFormat,

selectedDate, instance.settings);

dates.not(this).datetimepicker("option", option, date);

document.getElementById("ArrivalStart").value = dates;



}

});



});

});

mein problem ist aber jetzt das ich das nicht hinbekommen das ich den wert von client zum server bekomme.

folgender code:
var dates = $("#ArrivalStartDatepicker").datetimepicker({

defaultDate: "+lw",

dateFormat: 'dd-mm-yy',

changeMonth: true,

numberOfMonths: 2,

ampm: true,

stepMinute: 10,

minuteGrid: 10,

onSelect: function (selectedDate) {

// var option = this.id == "ArrivalStartDatepicker" ? "minDate" : "maxDate",

// instance = $(this).data("datetimepicker"),

document.getElementById("TotalLabel").value = $.datetimepicker.parseDate('yy-mm-dd', '2012-05-23');

// instance.settings.dateFormat ||

// $.datetimepicker._defaults.dateFormat,

// selectedDate, instance.settings);

// dates.not(this).datetimepicker("option", option, date);

// document.getElementById("TotalLabel").value = date;
alert(dates.datetimepicker('getDate')) //das funktioniert einwandfrei
}

});

mein HiddenField heißt ArrivalStart

und jetzt würde ich gerne den wert den ich im datetimepicker wähle in das Hiddenfield schreiben und dann den wert vom hiddenfield in eine Variable schreiben.

ich weiss nicht wie :-)

mfg

tobi