迅睿CMS框架是一款PHP8高性能·簡單易用的CMS開源開發(fā)框架,基于MIT開源許可協(xié)議發(fā)布,免費且不限制商業(yè)使用,是免費開源的產(chǎn)品,以萬端互聯(lián)為設(shè)計理念,支持的微信公眾號、小程序、APP客戶端、移動端網(wǎng)站、PC網(wǎng)站等多終端式管理系統(tǒng)。
聯(lián)系官方銷售客服
1835022288
028-61286886
怎么自定義表單中上傳圖片???自己的模板?求幫忙?
參考文檔:《前端自定義上傳文件方式》 參考以下
回復(fù)@迅??蚣苈?lián)合創(chuàng)始人
上傳成功后又跳這個
<tr>
<td>
{php extract(dr_get_form_post_value('yishenqing'))}
<form action="" method="post" name="myform" id="myform">
{$form}
<table cellpadding="0" cellspacing="0" class="zitable">
<td height="28" align="right" width="82">
姓 名</td>
<td height="28"><input type="text" name="data[title]" >
<span class="red">*</span></td>
<td height="28" align="right">工作單位</td>
<td height="28"><input type="text" name="data[gzdw]"></td>
</tr>
<td height="28" align="right">證件名稱</td>
<td height="28"><input type="text" name="data[zjmc]">
<td height="28" align="right">證件號碼</td>
<td height="28"><input type="text" name="data[zjhm]">
<td height="28" align="right">通信地址</td>
<td height="28"><input type="text" name="data[tongxindizhi]">
<td height="28" align="right">證件照片</td>
<td height="28">
<script src="{THEME_PATH}assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<input id="file" type="file" name="file"/>
<input id="dr_file" type="hidden" value="" name="data[zjzp]"/>
<button onclick="UpladFile()">上傳文件</button>
<label id="show_file"></label>
<script type="text/javascript">
function UpladFile() {
$('#show_file').html('正在上傳...');
var fileObj = document.getElementById('file').files[0]; // 獲取文件對象
var FileController = "/index.php?s=api&c=file&token={dr_get_csrf_token()}&m=upload&p=e55f4e433f29944215937690dbf3fe03&fid=74";
// 接收上傳文件的后臺地址,418是上面的字段id號
var form = new FormData();
form.append("author", "xunruicms"); // 可以增加表單數(shù)據(jù)
form.append("file_data", fileObj); // 文件對象
// XMLHttpRequest 對象
var xhr = new XMLHttpRequest();
xhr.open("post", FileController, true);
xhr.onload = function () {
var json = JSON.parse(xhr.responseText);
if (json.code) {
alert('上傳成功');
$('#dr_file').val(json.id); // 把上傳成功的文件id賦值給表單控件
$('#show_file').html('上傳成功:'+json.info.url); // 返回文件的url
} else {
alert('上傳失?。?#39;+json.msg);
$('#show_file').html('上傳失?。?#39;+json.msg);
}
console.log(json);
xhr.send(form);
</script>
</td>
<td height="28" align="right">聯(lián)系電話</td>
<td height="28"><input type="text" name="data[lxdh]">
<td height="28" align="right">
傳 真</td>
<td height="28"><input type="text" name="data[cz]" >
<td height="28" align="right">電子郵件</td>
<td height="28" ><input type="text"name="data[dzyj]" >
<span class="red">*</span>
<td height="28" align="right">郵政編碼</td>
<td height="28"><input type="text" name="data[yzbm]"></td>
</table>
回復(fù)@小波工作室--標(biāo)簽和API大師 其他都可以提交
action需要設(shè)置一個值呀
回復(fù)@小波工作室--標(biāo)簽和API大師 這個是怎么設(shè)置的??有沒有實例?可以幫忙加一下嗎?
回復(fù)@小波工作室--標(biāo)簽和API大師他這個圖片地址還是上傳不上去
我做的表單,支持上傳圖片,需要可以QQ找我
我是直接用的默認(rèn)表單的上傳,你也可以試試,改下樣式就行了。
我看了一下文件上傳相關(guān)代碼,p值組成是這樣:
$p = dr_authcode([ 'size' => ($field['setting']['option']['size']), 'exts' => $field['setting']['option']['ext'], 'attachment' => $field['setting']['option']['attachment'], 'image_reduce' => $field['setting']['option']['image_reduce'], ], 'ENCODE')
fid:
$field['id']
創(chuàng)建表單生成的代碼:
<div class="form-group" id="dr_row_zjzp"> <label class="control-label col-md-2"><span class="required" aria-required="true"> * </span>證件照片</label> <div class="col-md-10"> <div class="row fileupload-buttonbar" id="fileupload_zjzp"> <div class="col-lg-12"> <span class="btn blue btn-sm fileinput-button"> <i class="fa fa-plus"></i> <span> 上傳 </span> <input type="file" name="file_data"> </span> <button onclick="fileupload_file_remove('zjzp')" style="margin-left: 5px;display:none" type="button" class="btn red btn-sm fileinput-delete"> <i class="fa fa-trash"></i> <span> 刪除 </span> </button> <span class="fileupload-process"> </span> </div> <div class="col-lg-12 fileupload-progress fade" style="display:none"> <div class="progress progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100"> <div class="progress-bar progress-bar-success" style="width:0%;"> </div> </div> </div> </div><p class="finecms-file-ts">上傳格式要求:jpg(5MB)</p><div id="fileupload_zjzp_files" class="files"><input type="hidden" id="dr_zjzp" name="data[zjzp]" value=""></div> <link href="/static/assets/global/plugins/jquery-fileupload/css/jquery.fileupload.css" rel="stylesheet" type="text/css"> <script src="/static/assets/global/plugins/jquery-fileupload/js/jquery.fileupload.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { fileupload_file_init({"name":"zjzp","ext":" \/(\\.|\\\/)(jpg)$\/i","size":5242880,"url":"\/index.php?s=api&c=file&token={dr_get_csrf_token()}&siteid=1&m=upload&p={$p}&fid={$fid}","unused_url":"\/index.php?s=api&c=file&m=input_file_list&p={$p}&fid={$fid}","input_url":"\/index.php?s=api&c=file&m=input_file_url&token={dr_get_csrf_token()}&siteid=1&p=&fid={$fid}&file=&one=1","tpl":"<div id=\"dr_zjzp_files_row\" class=\"file_row_html files_row\"><div class=\"files_row_preview preview\">{preview}<\/div><input type=\"hidden\" id=\"dr_zjzp\" class=\"files_row_id\" name=\"data[zjzp]\" value=\"{id}\" \/><\/div>","area":["80%","80%"],"url_area":["50%","300px"],"chunk":0}); }); </script></div> </div>
你自己測試改動一下
回復(fù)@優(yōu)速-有償幫忙解決問題 替自己宣傳的時候請不要截圖別人網(wǎng)站的表單,說是自己做的表單。格局大一點啊,大佬。
參考文檔:《前端自定義上傳文件方式》 參考以下
回復(fù)@迅??蚣苈?lián)合創(chuàng)始人

上傳成功后又跳這個

回復(fù)@迅??蚣苈?lián)合創(chuàng)始人
<tr>
<td>
{php extract(dr_get_form_post_value('yishenqing'))}
<form action="" method="post" name="myform" id="myform">
{$form}
<table cellpadding="0" cellspacing="0" class="zitable">
<tr>
<td height="28" align="right" width="82">
姓 名</td>
<td height="28"><input type="text" name="data[title]" >
<span class="red">*</span></td>
<td height="28" align="right">工作單位</td>
<td height="28"><input type="text" name="data[gzdw]"></td>
</tr>
<tr>
<td height="28" align="right">證件名稱</td>
<td height="28"><input type="text" name="data[zjmc]">
<span class="red">*</span></td>
<td height="28" align="right">證件號碼</td>
<td height="28"><input type="text" name="data[zjhm]">
<span class="red">*</span></td>
</tr>
<tr>
<td height="28" align="right">通信地址</td>
<td height="28"><input type="text" name="data[tongxindizhi]">
<span class="red">*</span></td>
<td height="28" align="right">證件照片</td>
<td height="28">
<script src="{THEME_PATH}assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<input id="file" type="file" name="file"/>
<input id="dr_file" type="hidden" value="" name="data[zjzp]"/>
<button onclick="UpladFile()">上傳文件</button>
<label id="show_file"></label>
<script type="text/javascript">
function UpladFile() {
$('#show_file').html('正在上傳...');
var fileObj = document.getElementById('file').files[0]; // 獲取文件對象
var FileController = "/index.php?s=api&c=file&token={dr_get_csrf_token()}&m=upload&p=e55f4e433f29944215937690dbf3fe03&fid=74";
// 接收上傳文件的后臺地址,418是上面的字段id號
var form = new FormData();
form.append("author", "xunruicms"); // 可以增加表單數(shù)據(jù)
form.append("file_data", fileObj); // 文件對象
// XMLHttpRequest 對象
var xhr = new XMLHttpRequest();
xhr.open("post", FileController, true);
xhr.onload = function () {
var json = JSON.parse(xhr.responseText);
if (json.code) {
alert('上傳成功');
$('#dr_file').val(json.id); // 把上傳成功的文件id賦值給表單控件
$('#show_file').html('上傳成功:'+json.info.url); // 返回文件的url
} else {
alert('上傳失?。?#39;+json.msg);
$('#show_file').html('上傳失?。?#39;+json.msg);
}
console.log(json);
}
xhr.send(form);
}
</script>
</td>
</tr>
<tr>
<td height="28" align="right">聯(lián)系電話</td>
<td height="28"><input type="text" name="data[lxdh]">
<span class="red">*</span></td>
<td height="28" align="right">
傳 真</td>
<td height="28"><input type="text" name="data[cz]" >
</td>
</tr>
<tr>
<td height="28" align="right">電子郵件</td>
<td height="28" ><input type="text"name="data[dzyj]" >
<span class="red">*</span>
</td>
<td height="28" align="right">郵政編碼</td>
<td height="28"><input type="text" name="data[yzbm]"></td>
</tr>
</table>
</td>
</tr>
回復(fù)@小波工作室--標(biāo)簽和API大師 其他都可以提交
action需要設(shè)置一個值呀
回復(fù)@小波工作室--標(biāo)簽和API大師 這個是怎么設(shè)置的??有沒有實例?可以幫忙加一下嗎?
回復(fù)@小波工作室--標(biāo)簽和API大師他這個圖片地址還是上傳不上去

我做的表單,支持上傳圖片,需要可以QQ找我
我是直接用的默認(rèn)表單的上傳,你也可以試試,改下樣式就行了。
我看了一下文件上傳相關(guān)代碼,p值組成是這樣:
fid:
創(chuàng)建表單生成的代碼:
你自己測試改動一下
回復(fù)@優(yōu)速-有償幫忙解決問題 替自己宣傳的時候請不要截圖別人網(wǎng)站的表單,說是自己做的表單。格局大一點啊,大佬。