0

I have tried to use AJAX, but nothing I come up with seems to work correctly. I am creating a menu editor. I echo part of a file using php and manipulate it using javascript/jquery/ajax (I found the code for that here: http://www.prodevtips.com/2010/03/07/jquery-drag-and-drop-to-sort-tree/). Now I need to get the edited contents of the div (which has an unordered list in it) I am echoing and save it to a variable so I can write it to the file again. I couldn't get that resource's code to work so I'm trying to come up with another solution.

If there is a code I can put into the $("#save").click(function(){ }); part of the javascript file, that would work, but the .post doesn't seem to want to work for me. If there is a way to initiate a php preg_match in an onclick, that would be the easiest.

Any help would be greatly appreciated.

The code to get the file contents.

<button id="save">Save</button>
<div id="printOut"></div>
<?php
    $header = file_get_contents('../../../yardworks/content_pages/header.html');
    preg_match('/<div id="nav">(.*?)<\/div>/si', $header, $list);
    $tree = $list[0];
    echo $tree;
?>

The code to process the new div and send to php file.

$("#save").click(function(){
    $.post('edit-menu-process.php', 
        {tree: $('#nav').html()}, 
        function(data){$("#printOut").html(data);}
    );
});

Everything is working EXCEPT something about my encoding of the passed data is making it not read as html and just plaintext. How do I turn this back into html? EDIT: I was able to get this to work correctly. I'll make an attempt to switch this over to DOMDocument.

$path = '../../../yardworks/content_pages/header.html';
    $menu = htmlentities(stripslashes(utf8_encode($_POST['tree'])), ENT_QUOTES);
    $menu = str_replace("&lt;", "<", $menu);
    $menu = str_replace("&gt;", ">", $menu);

    $divmenu = '<div id="nav">'.$menu.'</div>';

    /* Search for div contents in $menu and save to variable */
    preg_match('/<div id="nav">(.*?)<\/div>/si', $divmenu, $newmenu);
    $savemenu = $newmenu[0];

    /* Get file contents */
    $header = file_get_contents($path);

    /* Find placeholder div in user content and insert slider contents */
    $final = preg_replace('/<div id="nav">(.*?)<\/div>/si', $savemenu, $header);

    /* Save content to original file */
    file_put_contents($path, $final);   
?>
Menu has been saved.
lefty55104
  • 127
  • 2
  • 14

1 Answers1

0

To post the contents of a div with ajax:

$.post('/path/to/php', {
    my_html: $('#my_div').html()
}, function(data) {
    console.log(data);
});

If that's not what you need, then please post some code with your question. It is very vague.

Also, you mention preg_match and html in the same question. I see where this is going and I don't like it. You can't parse [X]HTML with regex. Use a parser instead. Like this: http://php.net/manual/en/class.domdocument.php

Community
  • 1
  • 1
000
  • 26,951
  • 10
  • 71
  • 101
  • If I place that code inside the save function, nothing happens when I click the save button. `$("#save").click(function(){ $.post('edit-menu-process.php', { tree: $('#nav').html() }, function(data) { console.log(data); });` – lefty55104 Jun 29 '13 at 16:48
  • Anything in your php error logs? Anything in the console? Check the Network tab of the Chrome inspector to debug what's being sent over the network. – 000 Jun 29 '13 at 16:55
  • And what if in your console you do `console.log($('#my_div').html())`? Does that show you the html in the div? – 000 Jun 29 '13 at 17:12
  • That's actually working now. I need to encode the data when I receive it in the php file. But instead of being html, it's plain text. Is there a better way to encode the data or is there an extra step I need to take? – lefty55104 Jun 29 '13 at 17:36
  • I don't understand. Can you give an example of the string that is being sent as `$_POST['tree']`? – 000 Jun 29 '13 at 17:42
  • `` – lefty55104 Jun 29 '13 at 17:43
  • It is `htmlspecialchars` that is converting html tags like `
    ` into text entities like `<div>`. Don't use htmlspecialchars here, and really don't use regex. Use a parser like DomDocument. I see from your other questions that you know how to use it.
     – 000 Jun 29 '13 at 17:48
  • I have a feeling the issue lies elsewhere. – 000 Jun 29 '13 at 17:55
  • I can try to change over what I have to DOMDocuments, and for one part of my program I have used it successfully. But for a different part I was unable to get it to work, so I will attempt to change it over. – lefty55104 Jun 29 '13 at 18:01
  • I have been able to use DOMDocument to save the contents, except the function ends up adding closing div tags. Is there any way to get rid of that? I am dealing with a header file and close those divs in the footer. – lefty55104 Jun 29 '13 at 18:43