Avatar billede reetz Nybegynder
19. maj 2010 - 17:25 Der er 7 kommentarer

Hjælp til at fjerne produkt ved timer udløb.

Hey,

Jeg har en countdown timer i javascript, inde i en DataList. Så vil jeg gerne ha lavet sådan at når tiden udløber på de forskellige produkter skal produktet fjernes fra siden.

Håber i kan hjælpe mig lidt på vej.

Her er javascriptet til min timer:

var regdate = /(\d+)[\/|\-](\d+)[\/|\-](\d+)\s(\d+)\:(\d+)\:(\d+)/i;

function CDate2(p_date) {
    var arr_date = regdate.exec(p_date);
    var new_date = new Date(arr_date[3], arr_date[2] - 1, arr_date[1], arr_date[4], arr_date[5], arr_date[6]);
    return new_date;
}

function FormatTime(p_seconds) {
    p_seconds = Math.floor(p_seconds / 1000);

    var d = Math.floor(p_seconds / 86400);
    p_seconds -= (d * 86400);

    var h = p_seconds % 86400;
    h = Math.floor(h / 3600);
    p_seconds -= h * 3600;

    var m = p_seconds % 3600;
    m = Math.floor(m / 60);
    p_seconds -= (m * 60);

    var s = p_seconds % 60;
   
    return d + " d " + h + " t " + m + " min. " + s + " sek.";
}

function RunTimer(p_id, p_datetime) {
    if (document.getElementById(p_id)) {
        var rt = document.getElementById(p_id);
        var now = new Date();
        var then = CDate2(p_datetime);
        if (now < then) {
            rt.innerHTML = FormatTime(then - now);
            setTimeout("RunTimer('" + p_id + "', '" + p_datetime + "')", 1000);
        } else {
        rt.innerHTML = "Tid udløbet";
       
       
        }
       
    }
}

Her er mit DataList:

<asp:DataList ID="DataList1" runat="server" DataSourceID="ObjectDataSource1" OnItemDataBound="DataList1_ItemDataBound"
                RepeatColumns="4" RepeatDirection="Horizontal" CellPadding="0" CellSpacing="1">
                <ItemTemplate>
                    <div class="datalistStyle">
                        <div align="center">
                            <br />
                            <asp:Label ID="ModelLabel" runat="server" Text='<%# Eval("Model") %>' Font-Bold="True"
                                Font-Size="12pt" ForeColor="#6699FF" />
                            <br />
                            <br />
                            <asp:Image ID="Image11" runat="server" ImageUrl='<%# Eval("Billede","~/ProductImages\\t__{0}") %>' />
                            <br />
                            <div id='<%# Eval("ProductID") %>' style="font-size: 16px; font-weight: bold; color: #FF0000;
                                font-style: italic;">

                                <script>                                    RunTimer('<%# Eval("ProductID") %>', '<%# Eval("Timer") %>');</script>

                            </div>
                        </div>
                        <div style="margin-left: 15px;">
                            <asp:Label ID="Label2" runat="server" ForeColor="#666666" Text="Type:" Font-Size="12px"></asp:Label>
                            <asp:Label ID="VariantLabel" runat="server" Text="" Font-Size="12px" ForeColor="#1B1B1B" />
                          </div>
                          <div style="margin-left: 15px;">
                           
                            <asp:Label ID="Label4" runat="server" ForeColor="Gray" Text="Color:" Font-Size="12px"></asp:Label>
                            <asp:Label ID="Label5" runat="server" Text='<%# Eval("Color") %>' ForeColor="#333333"
                                Font-Size="12px" />
                                </div>
                                <div style="margin-left: 15px; padding-bottom: 5px;">
                               
                                <asp:Label ID="Label1" runat="server" ForeColor="Gray" Text="Amount:" Font-Size="12px"></asp:Label>
                            <asp:Label ID="AntalLabel" runat="server" Text='<%# Eval("Antal") %>' ForeColor="#333333"
                                Font-Size="12px" />
                        </div>
                        <div align="center">
                            <cc2:ModalPopupExtender ID="mpeReview" runat="server" BackgroundCssClass="popupBackground"
                                CancelControlID="btnCancel" PopupControlID="pnlPostReview" TargetControlID="ImageButton1">
                            </cc2:ModalPopupExtender>
                            <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl=""
                                OnClick="ImageButton1_Click" />
                            <br />
                        </div>
                    </div>
                </ItemTemplate>
            </asp:DataList>
Avatar billede FarmerHE Nybegynder
22. maj 2010 - 12:20 #1
Jeg ved ikke om det virker men prøv at smid det du vil skjule ind i en <div> eller andet med et specifikt navn når du så vil skjule det så find elementet med javascript og sæt Element.hidden = true

Mvh
HE
Avatar billede reetz Nybegynder
22. maj 2010 - 17:57 #2
Hvis jeg gør det på denne måde, så bliver alle min produkter skjult når 1 af proukternes timer går i nul.

Skulle gerne kun være det produkt hvor timeren går i nul der skulle skjules..
Avatar billede FarmerHE Nybegynder
22. maj 2010 - 19:29 #3
Så del det op i flere forskellige

der hvor jeg har set det brugt det er der flere <tr> elementer hver med sit navn. Har ikke lige koden til det her men kan finde den på tirsdag igen hvis du ikke har fået det løst der.

Kan være hvert TR element indeholder en div med et unikt navn men burde være muligt at lave så du kun har et unikt navn pr. produkt

Mvh
HE
Avatar billede janmanden Nybegynder
23. maj 2010 - 17:14 #4
Hvis du ændrer i din datalist og tilføjer et id:

Fra
<div class="datalistStyle">

Til
<div class="datalistStyle" id='pi<%# Eval("ProductID") %>'>

Så har du et reference punkt i forhold til timeren går jeg ud fra.

Hvis du endvidere ændrer i funktionen RunTimer

Fra:
} else {
rt.innerHTML = "Tid udløbet";
}     

Til:
} else {
rt.innerHTML = "Tid udløbet";
setTimeout("HideBlock('pi"+p_id+"')", 5000);
}     

Her antager jeg at "Tid udløbet" skal vises i et kort stykke tid inden elementet skjules.

Og så tilføjer en simpel funktion til skjule elementet:

// ny funktion:       
function HideBlock(id) {
if (document.getElementById(id)) {
  document.getElementById(id).style.display = 'none';
}
}


Jeg ved dog ikke rigtigt helt hvad ideen med siden er, men jeg antager at der vel skal vises nogle nye produkter i stedet når andre udløber, så den kunne vel egentlig også bare reloades et par sekunder efter et produkt er udløbet i stedet for at skjule et element?
Avatar billede reetz Nybegynder
24. maj 2010 - 17:26 #5
Får kun timeren til at forsvinde, produktet forsvinder ikke?

Ja når timeren udløber er det meningen at det produkt skal slettes/skjules.
Hvorefter admin kan tilføje nye..
Avatar billede janmanden Nybegynder
25. maj 2010 - 01:52 #6
Hvert produkt befinder sig, så vidt jeg kan se inden i en blok: <div class="datalistStyle">(produkt)</div>. Når den blok skjules så forsvinder produktet også fra brugerens synspunkt, dvs. både billede, labels osv. for det produkt hvor timeren er udløbet, men måske er det bedre at lave en location.reload() efter et stykke tid i stedet for at skjule elementet.
Avatar billede reetz Nybegynder
25. maj 2010 - 01:59 #7
Hvad hvis jeg vil slette produktet i min mssql db, når tiden er udløbet. Så forsvinder produktet hvertfald..
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

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