[ASP.NET/Javascript] Waarde behouden in client-side textbox

[habermas]

Ik heb een ASP.NET applicatie waarbij ik door middel van een pop-up een value (door de gebruiker geselecteerd in een TreeView) toon in een textbox op de 'moeder-pagina'. Die textbox moet client-side zijn, anders kan ik em niet via Javascript benaderen. Dit gaat allemaal goed, ik kan de geslecteerde waarde ook gebruiken in de code-behind dmv Request.Form["TextBox"], alleen kan ik de waarde niet in de TextBox behouden na een post-back.

Misschien is er een heel simpele oplossing voor (ik het t al met een Get/Set property geprobeerd maar dat lukte ook niet), maar ik zie em zo gauw niet

Iemand een idee??

[Manuel]

Per PHP zou ik het per cookie of per session setten, dat ziet er dan zo uit:

PHP:

if($_POST["submit"]) {
        $_SESSION["TextBox"] = $_POST["TextBox"];
}

Dan is het alleen nog een kwestie van HTML:

HTML:

<textarea rows="10" cols="10" name="blabla"><?php echo $_SESSION["TextBox"]; ?></textarea>

Ik weet dat dit bij lange na geen ASP.NET is maar misschien heb je hier iets aan.

[Janoz]

Is de textbox wel opgenomen in het form? Ik zou namelijk verwachten dat het veld, bij het renderen van de pagina, gewoon wordt gevuld met de waarde die het had. Verder begrijp ik niet helemaal wat je bedoelt met 'clientside houden'.

[Verwijderd]

Als Viewstate enabled is, dan moet ie dat gewoon onthouden.

[habermas]

Een cookie zou misschien een oplossing zijn, maar niet een hele nette.

Wellicht nog relevant is dat het om een user-control gaat (.ascx), daarom is er geen Form in de HTML gedefinieerd.

De textbox met de waarde erin is een client-side textbox

<input type="text" id="tbName" name="tbName" />

Dit is noodzakelijk om de waarde die de gebruiker selecteert dmv een pop-up terug te sturen via Javascript. (Je kan met Javascript toch geen server-side controls benaderen?). Dit werkt ook prima, en ik kan de waarde dus ook dmv Request.Form in de code behind gebruiken. Maar na een postback verlies ik de waarde in de textbox, en kan ik em niet behouden

[L-VIS]

Als die input declaratie zoals je hierboven schrijft in je ASCX staat gaat het idd niet werken. Je moet er een server control van maken, en je kan die wel met javascript benaderen. Hiervoor moet je kijken naar ClientId.

[habermas]

bedankt voor de tips mensen! wellicht dat

<%@ Control Language="C#" AutoEventWireup="true" EnableViewState="true">

al werkt, anders ga ik met textbox.ClientID aan de slag.

ik zal een evt. oplossing posten

[habermas]

ik krijg het toch niet voor elkaar..

dit is wat ik in de code-behind van de pop-up (aspx) heb:

C#:

            string t = TV1.SelectedNode.Text;
            hidden1.Text = t;
            ScriptManager.RegisterStartupScript(this, this.GetType(), "startScript", "passValue();", true);

dit is de Javascript code:

JavaScript:

<script type="text/javascript">
    function passValue() {

        var text = document.getElementById('hidden1').text;
        window.opener.document.getElementById('tbName').value = text;
        window.close();
    }

Om nu value van een server-side textbox te zetten zou ik iets als

JavaScript:

        window.opener.document.getElementById('UserControl_txtName.ClientID').value = text;

moeten doen?

[ Voor 5% gewijzigd door habermas op 20-05-2009 14:04 ]

[gorgi_19]

Visual Basic .NET:

<%= FindControl("melp").ClientId %>

[Verwijderd]

De client-side naam van server side controls (alles met runat="server") hangt af van de naming container waar deze in zit. Om die te weten moet je de ClientId property van het control gebruiken, waar L-VIS al op wees.
Je kunt met de ScriptManager dan de juiste Javascript dynamisch in je pagina outputten.

[habermas]

het probleem zit em inderdaad erin dat het om een User Control gaat en niet een gewone aspx-pagina.

in een gewone aspx-page zou het volgende werken:

JavaScript:

 function update(elemValue)
{
       document.getElementById('txtName').innerText=elemValue[0];
       document.getElementById('txtValue').innerText=elemValue[1];
}

Maar wanneer je dit plaatst in een User Control krijg je een null-reference exception op txtName en txtValue.....

Nu zou de oplossing hier ergens in moeten liggen, maar ik krijg hem niet werkend

JavaScript:

 function update(elemValue)
{
       document.getElementById("'txtName.UniqueID"').innerText=elemValue[0];
       document.getElementById("'txtValue.UniqueID'").innerText=elemValue[1];
}

Javascript wil er niet mee doorgaan na het UniqueID stukje, omdat dat weer gewone C# code is.. Zou het met escape characters werken?? Ben helaas geen Javascript expert

[creator1988]

Je ID's liggen niet vast, en je moet dus aan je popup doorgeven welk element hij moet targetten.

Maak een variabele aan in je popup window, maak vanuit de pagina waaruit je de popup aanroept een referentie naar je popup, en zet de variabele als in

code:

popupReference.variabeleNaam = '<%=txtName.ClientID%>';

Je kunt nu vanuit je popup iets doen als:

code:

window.opener.document.getElementById(variabeleNaam).value = 'Hallo dit is de nieuwe waarde';

Je kunt ook een reference maken vanuit de popup naar de ScriptManager op je parentpagina, en vanuit daar met $get() het juiste control zoeken, maar dat lijkt me voor nu even overkill.

[creator1988]

NB. Nog eens netter geschreven.

1. In je usercontrol (code behind)

code:

    protected void Page_Init(object sender, EventArgs e)
    {
        Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "controlDeclarations",
            "var myTextbox = '" + text1.ClientID + "';", true);
    }

2. In je popup pagina

code:

    <div id="test"></div>
    <script type="text/javascript">
        document.getElementById('test').innerHTML =
            parent.opener.document.getElementById(parent.opener.myTextbox).value;
    </script>

Je popuppagina toont nu de value van je textbox op je hostpagina (waar je ook het usercontrol hebt staan).

[habermas]

creator, bedankt voor je snelle en heldere reply! tweakers lag er hier even uit, maar ik zal eea gelijk gaan toepassen... ill let you know....

het rare is dat ik in de tussentijd de UniqueID's van de twee textboxen heb uitgelezen, en hij ze wel correct teruggeeft wanneer ik die er hard-coded instop

JavaScript:

                    document.getElementById('dnn$ctr1646$UserControl$txtName').innerText=elemValue[0];
                    document.getElementById('dnn$ctr1646$UserControl$txtValue').innerText=elemValue[1];

[creator1988]

De ID's waren gegenereerd. Je mag er dus niet van uitgaan dat je hardcoded verwijzingen blijven bestaan. Vandaar de workaround met object.ClientID.

[gorgi_19]

creator1988 schreef op donderdag 28 mei 2009 @ 23:35:
De ID's waren gegenereerd. Je mag er dus niet van uitgaan dat je hardcoded verwijzingen blijven bestaan. Vandaar de workaround met object.ClientID.

Het is niet echt een workaround; je ID wordt bepaald aan de locatie in de collection tree. Voeg je controls toe of wijzig je ID's van parent elementen, dan wijzigt ook je ID

[creator1988]

gorgi_19 schreef op vrijdag 29 mei 2009 @ 05:41:
[...]

Het is niet echt een workaround; je ID wordt bepaald aan de locatie in de collection tree. Voeg je controls toe of wijzig je ID's van parent elementen, dan wijzigt ook je ID

Ik blijf het niet netjes en intuitief vinden zoals het nu gedaan moet worden; hell voor frontend developers. Meer controle over je clientside ID's komt nu wel met ASP.NET MVC.

[Janoz]

creator1988 schreef op vrijdag 29 mei 2009 @ 07:10:
[...]


Ik blijf het niet netjes en intuitief vinden zoals het nu gedaan moet worden; hell voor frontend developers. Meer controle over je clientside ID's komt nu wel met ASP.NET MVC.

Het probleem dat je krijgt wanneer een component zelf zijn ID bepaald is dat het component zelf niet weet wat er op de rest van de pagina staat en dus niet kan controleren of zijn id wel uniek is.

Bij JSF (wat vergelijkbaar is met ASP.NET en dus ook hetzelfde eufel heeft) zorgen ze ervoor dat de gegenereerde ID redelijk voorspelbaar wordt. Een ID van een formulierveld bestaat bijvoorbeeld uit formid:veldid. Bij radiobuttons of andere itteraties komt er een :0,:1,:2, enz achter. Hierdoor zijn de ID's van elementen behoorlijk stabiel en is het behoorlijk werkbaar voor frontend developers.

Wat ik me trouwens afvraag is hoeveel last frontend developers er uberhaupt van hebben. Meer dan CSS zouden ze niet hoeven doen, en daarin heb je maar af en toe daadwerkelijk de ID's nodig. Het meeste is goed te doen door classes en nesting te gebruiken.

[habermas]

hey creator, nogmaals bedankt, het werkt prima. hieronder mijn aangepaste code, om een text en een value vanuit een popup naar een textbox en een hidden field op de opener (user control) te sturen:

in de popup:

HTML:

<input type="hidden" name="hidden1" id="hidden1" runat="server" value="" />
<input type="hidden" name="hidden2" id="hidden2" runat="server" value="" />

JavaScript:

    <script type="text/javascript">
        function PassValue() {
            parent.opener.document.getElementById(parent.opener.myTextbox).value = document.getElementById('hidden1').value;
            parent.opener.document.getElementById(parent.opener.myValue).value = document.getElementById('hidden2').value;

            window.close();
        }
    </script>

C#:

            //get values
            string t = TV1.SelectedNode.Text;
            string v = TV1.SelectedNode.Value;

            hidden1.Value = t;
            hidden2.Value = v;

            ScriptManager.RegisterStartupScript(this, this.GetType(), "PassValue", "PassValue();", true);

in de user-control:

HTML:

:
<asp:TextBox ID="txtOrg" runat="server"></asp:TextBox>
<input type="hidden" name="orgValue" id="orgValue" runat="server" />

C#:

       protected void Page_Init(object sender, EventArgs e)
        {
            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "controlDecl1", "var myTextbox = '" + txtOrg.ClientID + "';", true); // TEXT
            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "controlDecl2", "var myValue = '" + orgValue.ClientID + "';", true); // VALUE
        }

[ Voor 11% gewijzigd door habermas op 08-06-2009 13:21 ]