Kan ik twee targets meegeven met ajaxform??

Je zou een .live() kunnen zetten op #previewd
Zodra daar iets in komt, kopiëren naar het andere doel.

Wat retourneert het PHP script?
En kun je datgene wat moet gebeuren niet afhandelen in de callback-functie van je ajaxForm()?

Dus zoiets:
- verstuur info naar PHP-script via AJAX-form
- PHP script doet zijn ding en stuurt de benodigde informatie terug...
- ... die wordt opgevangen door de callback-functie, waarmee je verder je visuele zaken op je scherm regelt?

Thomas,
Ik denk dat jij de oplossingsrichting hebt.

Het PHP script retourneert de thumbnail van de ingebrachte afbeelding.

 echo "<img src='".$path.$actual_image_name."' class='preview' height='".$height."' width='".$width."'>"; 

Met de onderstaande jsquery wordt het in de pagina geplaatst.

 $("#imageforme").ajaxForm({target: '#previewe'}).submit(); 

De bedoeling is dat er dan ook een kruis bij wordt geplaatst om het plaatje weer te kunnen verwijderen. (zoals marktplaats dat ook doet). Dat kruis zet ik er in de jsquery als volgt onder:

 	 $("#previewec").html('<div class="close" title="Verwijderen"><img src="../pics/cross.png" height="13" width="13">'); 

Maar het kan voorkomen dat er geen afbeelding of een verkeerd bestandsformaat wordt opgegeven. Dat wordt in het php script opgemerkt en afgevangen. Waar ik naar zoek is dat in dat geval er géén kruis wordt geplaatst. Die voorwaardelijke plaatsing kan ik maar niet in het php script krijgen.

Ik zoek dus eigenlijk naar wat jij voorstelt. De callback functie. Maar dat gaat (nog) boven mijn pet. Misschien weet jij hoe ik dat met die functie kan afhandelen binnen het js-script?

Je kan de callback functie op dezelfde manier declareren als met JQuery's $.ajax() methode.
Dus:
[code lang="js"]
$("#imageforme").ajaxForm({
success: function(r) {
// hier je afhandeling
}
});
[/code]

Thx Ger, Ik heb vandaag gegoogled op de call back functie. Zag deze oplossing langskomen, maar waar ik niet de vinger achter krijg is hoe ik uit de php functie waarden teruggeef aan de call back functie zodat ik voorwaardelijk acties kan uitvoeren. Ik hoop dat ik duidelijk kan maken waar mijn probleem ligt. Ik weet hier nét te weinig van. Helaas.

Het formaat is meestal JSON.

Aan de verwerk-zijde waar je naartoe POST:

<?php
// misschien hier ook een header voor Content-Type
echo json_encode(array(
    'error' => false,
    'moreData' => ...
));
?>

Deze output zit als parameter in je (wordt na afloop teruggestuurd naar je) callback-functie:
success: function(data) { ... }

Vervolgens kun je daar de draad weer oppakken, de callback-functie wordt uitgevoerd als deze het resultaat van de POST-operatie terug heeft ontvangen:

$("#imageforme").ajaxForm({
    // misschien hier ook ergens een vermelding welke formaat de callback functie terugverwacht (json)
    success: function(r) {
        if (r.error) { // de boolean uit je PHP array
            // foutafhandeling
        } else {
            // verdere verwerking van r.moreData
        }
    }
});

Ja kan bij de options een datatype meegeven, als je daarvoor json opgeeft kan je meerdere waarden doorgeven.

In php:

<?php
echo json_encode(array('success' => true,
		'content' => 'test1',
		'othercontent' =>'test2');
?>

In javascript:
[code lang="js"]
("#imageforme").ajaxForm({
dataType: 'json',
success: function(r) {
// r is de response die van php terugkrijgt
// als je json voor dataType gebruikt wordt
// dit automatisch omgezet naar een object
if (r.success) {
$(#content).html(r.content);
$(#othercontent).html(r.othercontent);
}
}
});
[/code]

OK Ger en Thomas. Nu moet het toch gaan lukken.
Morgen maar eens fris beginnen.
thx tot dusver!

Voorlopig lukt het me nog niet. Ik heb ontdekt dat de php functie alleen wordt uitgevoerd als ik de regel waarin de json_encode array geëchood wordt tussen aanhalingstekens zet. Dat is wel vreemd omdat alle voorbeelden die ik vind, inclusief die van jullie niet (!) tussen haakjes zet.
Verder heb ik heb voor de zekerheid een vermelding van het formaat van de callback functie toegevoegd. Die header staat helemaal bovenin de php functie om te voorkomen dat er een output plaats vindt vóór de header.

In het script heb ik het eenvoudig gehouden:

 
$("#imageforme").ajaxForm({
    dataType: 'json',	success: function(r) {
        if (r.success) {
	    $("#previewe").html('<div class="close" title="Verwijderen"><img src="../pics/afbeelding.png">');
        }
    }
}).submit();

Misschien moet ik ook nog een heading in het script plaatsen?


[size=xsmall]Toevoeging op 16/02/2015 22:36:12:[/size]

Inmiddels is het me gelukt. Ipv

<?php
echo json_encode(array('success' => true,
    'content' => 'test1',
    'othercontent' =>'test2');
?>

heb ik een heading toegevoegd en de array als volgt gevuld:

$arr = array('success' => true, 'content' => 'test1', 'othercontent' => 'test2');
echo json_encode($arr);

Ik kom in het script in de true voorwaarde. Nu nog de meegegeven waarden uitlezen. Dat moet het pad aanr en de naam van de afbeelding worden.......

[size=xsmall]Toevoeging op 16/02/2015 23:55:58:[/size]

Ik heb 'm inmidddels helemaal werkend. Het voorbeeld van Ger (php code) mist een haakje op het eind.
De callback werkt alleen niet als ik ipv test1 een variabele ingeef met pad/naam van de afbeelding.
Weet iemand hoe je dat doet. Ik heb nu dit staan

$_SESSION['afb'][$afbnr]= $actual_image_name;
$image = "<img src='".$path.$actual_image_name."' height='".$height."' width='".$width."'>";
$arr = array(
  "success" => true, 
  "previewe" => $image);
echo json_encode($arr);

De afhandeling in het javascript kan die $image niet lezen....

Een json string met enkele quotes geeft problemen, dus je moet dit omdraaien

<?php
$image = '<img src="'.$path.$actual_image_name.'">';
?>

Je hebt de width en height attributen alleen nodig als je wilt afwijken van het oorspronkelijke formaat.