2014-04-10 9 views
6

HTML'de bir taklitim. Projemde, kullanıcının bir dosyayı düzenlemesine ve kaydetmesine izin vermek için ACE editörünü kullanmak istiyorum. Dosyayı yüklemeyi ve ACE editörüyle açmayı başarabilirim. Sorun, nasıl kaydedileceğidir. Bu bölüm için yardımınıza ihtiyacım var.Bir dosyayı düzenlemek ve kaydetmek için ACE düzenleyicisi nasıl kullanılır?

ACE'yi kullanmak için yazdığım kod İşte. kaydetmek düğmesini kullanarak

benim modifikasyon kurtarmak

<?php 
if(isset($_POST["save_modification"])){ 
$file = "./".$_POST["file_name"]; 
$file_ptr=fopen($file,"w"); 
fwrite($file_ptr,$_POST["content"]); 
fclose($file_ptr); 
}?> 

<html> 

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<link rel="stylesheet" media="all" type="text/css" href="./css/style.css" /> 
<title>Test</title> 
</head> 

<body> 
<div class="site"> 
    <div class="header"> 
     <span>Test</span> 
    </div> 
</div> 

<div class="clean"></div> 

<div class="corp"> 
    <div class="corp_ctn"> 
     <h1>Edit a file</h1> 

     <div id="content" class="paragraphe"> 

      <?php 
       $dir=opendir("./"); 
       while($file=readdir($dir)){ 
        if(!in_array($file, array(".",".."))) { 
         echo '<div style="float:left; margin:0 10px; text-align:center;"><a href="?f='.$file.'">'; 
         echo $file; 
         echo '</a></div>'; 
         echo '<br/>'; 
        } 
       } 
      ?> 

      <br clear="all"/> 

      <?php 
       if(isset($_GET["f"])) { 
        echo "<h1>{$_GET["f"]}</h1>"; 
        $file = "./".$_GET["f"]; 
        $content = file_get_contents($file); 
      ?> 


        <form method="POST" action="index_select_lua_script.php"> 
         <div id="editor" name="content" style="width:100%;height:200px;"> 
          <?php echo $content ?> 
         </div> 

         <script src="js/ace/ace.js" type="text/javascript" charset="utf-8"></script> 
         <script> 
          var editor = ace.edit("editor"); 
          editor.setTheme("ace/theme/monokai"); 
          editor.getSession().setMode("ace/mode/lua"); 
          editor.getSession().setTabSize(4); 
          editor.setHighlightActiveLine(true); 
          editor.resize(); 
         </script> 
         <input type="hidden" name="file_name" value="<?php echo $_GET["f"] ?>" /> 
         <input type="submit" name="save_modification" value="Save modification" /> 
        </form> 
        <br/><br/> 
      <?php 
       } 
      ?> 
      </div> 
     </div> 
    </div> 
</div> 

, içeriği boş. Lütfen, nasıl yapabileceğime dair bir fikriniz var mı?

Eğer

+0

Div bir form öğesi değil. Muhtemelen gizli olan ve saklanan tıklatıldığında gizli içeriğin div ile içeriğiyle doldurulduğu ve formu göndermeye devam edildiğinde başka bir girdi veya tekstüre ihtiyacınız olacaktır. – ElefantPhace

cevap

1

HTML5 Dosya Sistemi API oldukça iyi şimdi bu gibi görevleri kolları ederiz. Editör alanının içeriğini yakalamanın birkaç yolu vardır ve bunu yaptıktan sonra kaydedebilirsiniz. gibi bir şey de

Görünüş:

http://www.codeproject.com/Articles/668351/HTML-File-API-Capability-and-Compatibility

http://blog.teamtreehouse.com/building-an-html5-text-editor-with-the-filesystem-apis

http://www.html5rocks.com/en/tutorials/file/filesystem/

nerede hatırlayamıyorum, ancak bunu isterseniz, birlikte de şimdi JS kullanarak dosyaları ZIP olabilir .