的Javascript表編輯器 - > MySQL的CREATE語句

Question

我要尋找一個JavaScript的插件，可以讓用戶創建使用一個非常基本的HTML界面MySQL表。理想情況下，HTML表格會產生一條CREATE語句。有誰知道這樣的腳本？

Answer 1

據我所知，沒有一個jQuery插件，可以讓你「創建」數據庫表，不管你仍然要使用一些服務器端代碼來處理實際的SQL等，這是不是太困難創造的東西你自己，我敲在一起this，我認爲這是你尋找的有點東西。 注：這不是一個完整的實現：P只是一個想法，基本上您需要使用HTML表，其解析成JSON，然後將其發送到服務器來處理它。

初始HTML '模板'：

<table id="table_designer"> 
    <tr class="table_name"> 
     <td><input type="text" placeholder="table name" /></td> 
    </tr> 
    <tr class="field_name"> 
     <td>name</td> 
     <td><input type="text" /></td> 
    </tr> 
    <tr class="type"> 
     <td>type</td> 
     <td><select> 
      <option>int</option> 
      <option>varchar</option> 
      <option>date</option> 
     </select></td> 
    </tr> 
    <tr class="primary_key"> 
     <td>primary key</td> 
     <td><input type="checkbox" /></td> 
    </tr> 
    <tr class="relationship"> 
     <td>related type</td> 
     <td><select> 
      <option>none</option> 
      <option>one to many</option> 
      <option>many to one</option> 
      <option>many to many</option> 
     </select></td> 
    </tr> 
    <tr class="related_table"> 
     <td>related table</td> 
     <td><input type="text" /></td> 
    </tr> 
    <tr class="related_field"> 
     <td>related field</td> 
     <td><input type="text" /></td> 
    </tr> 
    <tr class="controls"> 
     <td><button id="save">save</button></td> 
     <td> 
      <button id="delete">delete</button> 
      <button id="add">add</button> 
     </td> 
    </tr> 
</table> 

一些jQuery來處理的行爲'

/* parses table as json and sends to server */ 
$('#save').click(function() { 
    var json= {}; 

    $('#table_designer tr').each(function(){ 
     var $t = $(this), 
      prop = $t.attr('class'); 

     json[prop] = []; 

     $t.children('td').each(function() { 
      json[prop].push($(this).children().first().val()); 
     }); 
    }); 

    alert(JSON.stringify(json, null, " ")); 

    /* send the data to the server 
    $.post('www.mysite.com', json, function(d, t, j) 
      { alert('success'); }); 
    */ 
}); 

/* deletes parent column */ 
$('#delete').click(function() { 
    var $t = $(this), 
     pos = $t.parents('td').index() + 1; 

    $('#table_designer tr').each(function(){ 
     $(this).children('td:nth-child(' + pos +')').remove(); 
    }); 
}); 

/* adds a new field */ 
$('#add').click(function() { 
    var $t = $(this), 
     pos = $t.parents('td').index() + 1; 

    $('#table_designer tr').each(function(){ 
     var clone = $(this).children('td').last().clone(true); 
     clone.children('input').val(''); 
     $(this).children('td:nth-child(' + pos +')').after(clone); 
    }); 
});