[C#] Gridview Select na javascript confirm()

[PdeBie]

Heren/dames developers,

ik heb een gridview waarbij het voor de gebruiker mogelijk moet zijn om, waar dan ook, op een rij te kunnen klikken om het record te selecteren. De rijen hebben geen select-commandfield om grafisch design redenen.

Om dit bovenstaande te bereiken heb ik onderstaande code in het RowDatabound event staan:

code:

e.Row.Attributes.Add("onclick", Page.ClientScript.GetPostBackEventReference(this.gvOrders, "Select$" + e.Row.RowIndex));

Dit werkt naar behoren!

Echter, zitten er records in het gridview die een bepaalde conditie* hebben waardoor de website eerst een javascript Confirm moet tonen alvorens het record geselecteerd word. * een record kan 'vergrendeld' zijn, doordat een andere gebruiker dit al in gebruik heeft
Dus als een gebruiker op een 'vergrendeld' record klikt, moet de website een confirm tonen. Bevestigd de gebruiker deze confirm, mag de website verder zoals voorheen, anders mag er niets gebeuren.

ik dacht dit te kunnen bereiken door eerder genoemde code aan te passen naar:

code:

string OnClick = Page.ClientScript.GetPostBackEventReference(this.gvOrders, "Select$" + e.Row.RowIndex);
e.Row.Attributes.Add("onclick", "return ConfirmUnlock();" + OnClick);

javascript functie:

code:

function ConfirmUnlock() {
        var answer = confirm("Ontgrendelen?");
        if (!answer) {
            return false;
        }
        return true;
    }

Maar dit mocht niet baten. Iemand een idee hoe dit op te kunnen lossen?
Het plaatsen van een command-field is helaas geen optie.

[RobIII]

pdebie schreef op donderdag 28 april 2011 @ 12:05:
Maar dit mocht niet baten. Iemand een idee hoe dit op te kunnen lossen?

Begin eens bij 't begin: staat de onclick in de output (HTML)? Wordt de functie überhaupt aangeroepen (lijkt me van niet) etc. etc.
Debuggen: Hoe doe ik dat?

pdebie schreef op donderdag 28 april 2011 @ 12:05:

code:

function ConfirmUnlock() {
        var answer = confirm("Ontgrendelen?");
        if (!answer) {
            return false;
        }
        return true;
    }

Beetje omslachtige manier voor:

JavaScript:

function ConfirmUnlock() {
        return confirm("Ontgrendelen?");
}

[PdeBie]

hai,

uiteraard had ik al gedebugged en de source bekeken, dat terzijde.

Als ik (stiekem) de select-command kolom toch toevoeg (niets zeggen tegen de grafisch designers hoor ) en ik klik daar op, dan werkt het geheel naar behoren. De confirm komt netjes in beeld (deze staat namelijk op rij niveau) en als je hem bevestigd gaat de site verder zoals gewenst. Bevestig je de confirm niet, wordt de rest keurig afgekapt.

Dit werkt echter alleen op die kolom. Niet op de rest van de rij.
Deze kolom wordt als volgt gerendered:

code:

<td><a href="javascript:__doPostBack('dnn$ctr385$OrderOverview$gvOrders','Select$2')">selecteer</a></td>

de rij zelf (waar deze kolom in zit) wordt zo gerendered:

code:

<tr onclick="return ConfirmUnlock();__doPostBack('dnn$ctr385$OrderOverview$gvOrders','Select$1')" onmouseover="this.style.cursor='pointer'"> ........ </tr>

Houdt je deze twee zaken naast elkaar zie je dus dat het enige verschil de confirm is.

code:

selecteer knop:
javascript:__doPostBack('dnn$ctr385$OrderOverview$gvOrders','Select$2')

gridview row:
return ConfirmUnlock();__doPostBack('dnn$ctr385$OrderOverview$gvOrders','Select$1')"

het lijkt er dus op dat ik iets fout doe met het opbouwen van de gridview row in het rowdatabound event, zoals omschreven in de startpost. Maar ik zie dus even niet wat.

Off-topic:
het omslachtige javascript verhaal was even omdat ik er eerst alerts tussen had gezet om te kijken wat de functie nu daadwerkelijk returned

[ Voor 5% gewijzigd door PdeBie op 28-04-2011 12:19 ]

[PdeBie]

Ik heb even een klein proefprojectje aangemaakt met de situatie zoals hierboven beschreven.
Hieronder de code:

ASPX

code:

<script type="text/javascript" language="javascript">
        function ConfirmUnlock() {
            if (!confirm("Order is vergrendeld. Wilt u deze ontgrendelen?"))
                return false;
            else
                return true;
        }
    </script>

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnRowDataBound="GridView1_RowDataBound" OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
        <Columns>
            <asp:CommandField ShowSelectButton="true" SelectText="selecteer" />
            <asp:BoundField HeaderText="ID" DataField="id" />
            <asp:BoundField HeaderText="NAAM" DataField="naam" />
            <asp:BoundField HeaderText="FUNCTIE" DataField="functie" />
        </Columns>
    </asp:GridView>

    <asp:Literal ID="liSelect" runat="server" />

Code-Behind

code:

    public partial class ConfirmPostback : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            List<Person> pList = new List<Person>();

            Person p1 = new Person();
            Person p2 = new Person();
            Person p3 = new Person();

            p1.id = "10";
            p2.id = "20";
            p3.id = "30";

            p1.naam = "Patrick";
            p2.naam = "Jurgen";
            p3.naam = "Leon";

            p1.functie = "Developer"; 
            p2.functie = "Helpdesk"; 
            p3.functie = "Manager";

            pList.Add(p1);
            pList.Add(p2);
            pList.Add(p3);

            liSelect.Text = "nothing selected";
            
            if (!Page.IsPostBack)
            {
                GridView1.DataSource = pList;
                GridView1.DataBind();
            }
        }

        protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
        { 
            if(e.Row.Cells[1].Text == "10")
                e.Row.Attributes.Add("onclick", Page.ClientScript.GetPostBackEventReference(this.GridView1, "Select$" + e.Row.RowIndex));

            if (e.Row.Cells[1].Text == "20")
                e.Row.Attributes.Add("onclick", "return ConfirmUnlock();" + Page.ClientScript.GetPostBackEventReference(this.GridView1, "Select$" + e.Row.RowIndex));
        }

        protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
        {
            liSelect.Text = "selected";
        }
    }

    class Person
    {
        public string id { get; set; }
        public string naam { get; set; }
        public string functie { get; set; }

        public Person()
        { }
    }

Helaas ook hierin hetzelfde probleem als eerder omschreven. zucht

[PdeBie]

Oplossing toch nog alsnog gevonden!
via: http://aspknowledgebase.w...15/the-grid-class-itself/

wat hebben we aangepast?
In het RowDatabound event hebben we deze regel:

code:

e.Row.Attributes.Add("onclick", "return ConfirmUnlock();" + Page.ClientScript.GetPostBackEventReference(this.GridView1, "Select$" + e.Row.RowIndex));

aangepast in:

code:

e.Row.Attributes.Add("onclick", "javascript:if (ConfirmUnlock()) {" + Page.ClientScript.GetPostBackEventReference(this.gvOrders, "Select$" + e.Row.RowIndex) + "}");

Wat denk ik dat er aan de hand is?
Op een asp:button zit een property getiteld 'OnClientClick'. Deze functie genereert clientside code als in 'onclick=......'.
Als je hier (zoals in mijn situatie) een javascript Confirm in zou returnen, dient dit als soort van validatie welke ervoor zorgt dat de serverside code niet afgaat als de clientside faalt (confirm returned false).
Dit werkt echter dus NIET op een gridview row command. Blijkbaar wordt een gridview rowcommand anders afgehandeld.

Een gridview row wordt gerenderd als tablerow '<tr>'. Deze kan ook een onclick bevatten, maar deze word dus verder niet gebruikt als 'validatie' voor het 'selectedindexchanged' event van de gridview. Dus door zelf een if-statement te schrijven in javascript tijdens het rowdatabound event, kunnen we dit alsnog afvangen.

Dit is mijn theorie. Als iemand weet hoe het exact zit, hoor ik het alsnog graag, maar dit lijkt mij op zich een logische uitleg van de situatie.