Div weergeven

Door Daan Vee op 02-02-2016 14:00

6.794 views

Ik heb de volgende code:


<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
function SubmitForm() {
var content = $("#content").val();
var naam = $("#naam").val();
$.post("shared/saveItem.php", { content: content, naam: naam },
   function(data) {
     alert("Data Loaded: " + data);
   });
}
</script>

En ik wil in plaats van de alert de volgende div weergeven:


        <div id="opslaan">
        <div class="alert alert-success alert-dismissable">
                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                    <h4>	<i class="icon fa fa-check"></i>Opgeslagen!</h4>
                    Het onderwerp is succesvol opgeslagen.
        </div>
        </div>

Hoe krijg ik dat voor elkaar?

Thomas van den Heuvel

10-02-2016 23:45

Twee reacties geleden legde ik uit wat er waarschijnlijk misgaat.
Een reactie geleden plaats ik de remedie.

Ik zou zeggen, lees beide nog eens aandachtig door.

Ook lijkt het mij handig dat je save-pagina expliciet terugcommuniceert of alles goed is gegaan, anders krijg je misschien ten onrechte een boodschap te zien dat dit het geval zou zijn. Omdat alles op de achtergrond gebeurt lijkt het mij Nogal Belangrijk dat je precies weet wat de status is.

Daan Vee

11-02-2016 21:15

Thomas, dank. Ik heb je script gebruikt en het werkt al voor 80 procent.
Wat ik alleen nog voor elkaar moet krijgen is dat m'n post.php-pagina een ID moet meekrijgen, zodat het formulier onder de juiste regel wordt opgeslagen.
Op de formulierpagina krijg ik dat ID via een GET, dus ID = $_GET['id'].
Hoe post ik dat ID door naar de post-pagina?

Ariën

11-02-2016 21:16

Daar is een data-attribuut voor.

Daan Vee

11-02-2016 21:34

En hoe voeg ik die toe aan $('#theForm').serialize() ?

Thomas van den Heuvel

11-02-2016 22:06 gewijzigd op 11-02-2016 22:07

Euh, gewoon via de URL meegeven niet makkelijk genoeg?

shared/saveItem.php?id=X

:/

Daan Vee

11-02-2016 22:39

Thanks!
Ergens loopt m'n formulier toch nog vast...
Hoe kan ik een melding terug sturen naar de formulierpagina? Zodat ik zie wat er gebeurt?

Thomas van den Heuvel

11-02-2016 23:11

Zie mijn code post hierboven?

Daan Vee

11-02-2016 23:30

Heb ik gekopieerd.
Maar achter succes: komt dan niks te staan. Ik zal toch ergens iets moeten terugsturen?

Thomas van den Heuvel

12-02-2016 00:41 gewijzigd op 12-02-2016 00:41

Bekijk mijn post.php nog eens? Daar output ik JSON met daarin een boolean (true of false) die aangeeft of de query is geslaagd. Deze krijg je weer terug in de ajax post functie in het argument "ok".

De "respons" van het PHP script vang je op met de callback functie in jquery - begin je het nu te vatten?

Daan Vee

13-02-2016 13:24

Top, ik snap het en het werkt!
Laatste vraag: ik wil graag de melding in m'n eigen stijl weergeven, als volgt:


<div id="postResult" style="display: none;">
		<div class="alert alert-success alert-dismissable">

                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                    <h4>	<i class="icon fa fa-check"></i>Opgeslagen!</h4>
                    Het onderwerp is succesvol opgeslagen.

        </div>
</div>

Nu heb ik al de css weggehaald, maar er komt nu alleen tekst te staan, ipv mijn opmaak:


$('#postResult').text('Success! :)');

Het zal vast heel simpel zijn, maar hoe zorg ik ervoor dat ik de melding in m'n eigen stijl te zien krijg?

Reageren

Inloggen om te reageren