Browse for file in inline edit field of edatagrid...

[bwwelle]

Hello,
I have a edatagrid in which the field, when the user clicks on it, needs to have a window that pops up to that they can browse for a file on the local machine, and then when they press ok on the window, the path of the file is entered into the field thumbnailfilename.  Can this be done with easyui functionality?  If so what would the code look like?  Thanks.

The html code:

Code:

<table id="videodg" title="Videos" style="width:700px;height:250px" toolbar="#videotoolbar" pagination="true" idfield="id"
    rownumbers="true" fitcolumns="true" singleselect="true">
      <thead>
        <tr>
          <th field="videoname" width="50" editor="{type:'validatebox',options:{required:true}}">Video Name</th>
		  <th field="videocode" width="50" editor="{type:'validatebox',options:{required:true}}">Video Code</th>
		  <th field="thumbnailfilename" width="50" class="easyui-validatebox" editor="{type:'file',options:{required:true}}">Thumbnail File Name</th>
        </tr>
      </thead>
    </table>
    <div id="videotoolbar">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-add" plain="true"
    onclick="javascript:$('#videodg').edatagrid('addRow')">New</a> 
    <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-remove" plain="true"
    onclick="javascript:$('#videodg').edatagrid('destroyRow')">Destroy</a> 
    <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-save" plain="true"
    onclick="javascript:$('#videodg').edatagrid('saveRow')">Save</a> 
    <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-undo" plain="true"
    onclick="javascript:$('#videodg').edatagrid('cancelRow')">Cancel</a></div>
    <script type="text/javascript">
                $(function(){
                        $('#videodg').edatagrid({
                                url: 'get_videos.php',
                                saveUrl: 'save_video.php',
                                updateUrl: 'update_video.php',
                                destroyUrl: 'destroy_video.php'
                        });
                });
        
</script>

[finzaiko]

I've made similar before, first create an inline crud as usual using edatagrid and then make an upload + image resize (kohana image class) function and update the file name to the database.
may like screenshot like this

i use yii :

Code:

class AttachController extends Controller {

    function actionIndex() {
        $dir = 'uploads';
        $uploaded = false;

        $model = new Attach();

        if (isset($_POST['Attach'])) {
            $model->attributes = $_POST['Attach'];
            $this->deleteFile($model->id);
            
            $file = CUploadedFile::getInstance($model, 'file');
            $initFile = date('YmdHis');
            if ($model->validate()) {
                $item = $this->loadItemModel($model->id);
                $item->file_path = $initFile;
                $item->save(false);
                $imgFile = strtolower('img'.$initFile.'.'.$file->extensionName);
                $imgPath = $dir . '/' . $imgFile;
                $thmFile = strtolower('thm'.$initFile.'.'.$file->extensionName);
                $thmPath = $dir . '/' . $thmFile;
                $uploaded = $file->saveAs($imgPath);
                $this->resizeImg($imgPath,$thmPath);
                echo CJSON::encode(array('success' => true));
            }else{
                echo CJSON::encode(array('msg' => 'Failed upload file.'));
            }
        }
    }
    
    function resizeImg($path,$newPath) {
        $img = Yii::app()->image->load($path);
        $img->resize(150,150);
        $img->save($newPath);
    }
....
... other function
.......

May it help

[bwwelle]

Thank you so much for the response.  So I'm a confused on how to integrated the class you provided into the html code that I displayed in my original post, specifically on the "thumbnailfilname" field line.  Can you point me in the right direction?  Thanks again!

[finzaiko]

That class if you're using Yii Framework, I haven't use pure php yet,
please refer to this http://hayageek.com/ajax-file-upload-jquery/