我尝试在ajax中发送表单而不重新加载页面,但我看到,文件上的链接不存在...... 我有下一个表格: 我尝试在ajax中发送表单而不重新加载页面,但我看到,文件上的链接不存在... 我有下一个表格: <form id="settings" method="POST" enctype="multipart/form-data"> ... <input type="file" id="logo" style="display:none;" name="logo" accept="image/png, image/jpeg, image/gif"> <button type="submit" id="send" class="btn btn-primary">save</button> </form> Ajax 脚本: $('#settings').submit(function(e){ e.preventDefault(); var form = $(this).serialize(); alert(form); // file is not attached... $.ajax({ url : '/settings', type : 'POST', crossDomain : false, data : form, contentType : 'multipart/form-data', dataType : 'json', progressData: false, cache : false, success : function(r){ alert (111); } }).fail(function(){ console.log('Error occured!'); }); }); 在服务器端,我收到错误: org.apache.tomcat.util.http.fileupload.FileUploadException:请求被拒绝,因为未找到多部分边界 我尝试不序列化表单,而是写了 data : form -> data : new FormData(this) 此选项会导致错误“非法调用”。如何在不重新加载页面的情况下发送带有文件的表单? 要使用 AJAX 发送带有文件的表单而不重新加载页面,您需要使用 FormData 来正确处理文件上传。 <form id="settings" method="POST" enctype="multipart/form-data"> <!-- Other form fields --> <input type="file" id="logo" name="logo" accept="image/png, image/jpeg, image/gif"> <button type="submit" id="send" class="btn btn-primary">Save</button> </form> $(document).ready(function() { $('#settings').submit(function(e){ e.preventDefault(); var formData = new FormData(this); $.ajax({ url: '/settings', type: 'POST', data: formData, contentType: false, processData: false, cache: false, success: function(response){ alert('Form submitted successfully!'); // Handle the response from the server }, error: function(){ console.log('Error occurred!'); } }); }); });
我正在尝试使用 DomDocument 获取下面表单的值,但到目前为止仍然失败 我正在尝试使用 DomDocument 获取下面表单的值,但到目前为止仍然失败 <?php $string ='<form action="profile" method="post" enctype="multipart/form-data"> <input type="hidden" name="id_user" id="id_user" value="123"> <input type="hidden" name="logo" id="logo" value="path/to/logo1.png"> <input type="hidden" name="status" id="status" value="Ok"> <input type="submit" value="PROFILE"> </form>'; ?> 这种情况下如何正确使用DomDocument? 我正在尝试下面的代码 $dom = new DomDocument(); $dom->loadHTML($string); $dom->getElementById("id_user"); 我期望得到 123 作为返回值 DomDocument 有点麻烦,但如果您遵循文档,您就可以到达那里。我找到了这条路线: $dom->getElementById("id_user")->attributes->getNamedItem("value")->value 返回: 123 参见:https://onlinephp.io/c/c37dc 可能还有其他方法可以做到同样的事情。
我有一个接收用户输入的表单。 我需要使用该输入来动态更改关联的 hx-replace-url。 这是 html 的片段 创建任何项目 我有一个接收用户输入的表单。 我需要使用该输入来动态更改关联的 hx-replace-url。 这是html片段 <div> <p>Create any item</p> <form enctype="multipart/form-data"> <span>with uri:</span> <input id="prefix" name="prefix"> <input value="2653ccd5-f76c-45e9-906a-468c9accdfc7" id="new_subject" style="width: 50rem;" name="new_subject"> <div> <button hx-post="/item" hx-target="#card_container" hx-swap="outerHTML" hx-replace-url="/item/<<MY VALUES FROM THE FORM>>">Create Item</button> </div> </form> </div> 有什么方法可以自定义刚刚输入表单的 hx-replace-url 表单值吗? 我在这里找到了答案htmx,使用表单值推送网址。有效。 综上所述,我设置了 hx-replace-url="true" 顺便说一句,此后不久我也会重定向。 所以这个组合是有效的。 我还没有在没有重定向的情况下测试 hx-replace-url="ture" 。
我有一个名为 Lodge.upload 的刀片模板。在该模板中,我有以下代码: 我有一个名为 Lodge.upload 的刀片模板。在该模板中,我有以下代码: <form name="app" action="storeSummons" enctype="multipart/form-data" method="post"> 在我的路线文件中我有这个: Route::post('/storeSummons',[\App\Http\Controllers\LodgesController::class,'storeSummons'])->name('storeSummons'); 当我尝试从这个简单的表单(只有两个字段)发布时,我收到错误 Lodge.uploads/storeSummons 路由不支持 POST 方法。支持的方法:GET、HEAD 该路线明确标记为 storeSummons,没有提及模板名称或其路线。 我已经尝试清除缓存、路由、视图,但它仍然坚持将其添加到路由中。该组仅具有添加中间件的身份验证。 这让我发疯,我检查了路线是否被重复但没有成功。 我将协助您解决 Laravel 应用程序中的“不支持 POST 方法”错误。以下是综合的回应,结合了专家反馈的见解并解决了潜在的原因: 理解错误: 不正确的路线或方法:该错误表明两者之间不匹配 表单的提交方法和定义的路线。 缺少 CSRF 令牌:Laravel 需要有效的 CSRF 令牌才能进行 POST 请求以防止跨站点请求伪造攻击。 故障排除步骤: 验证路线定义: 确保路由定义为 POST 路由: Route::post('/storeSummons', ...)。 检查是否有任何具有相同路径或名称的冲突路由。 如果路由在组内,请确认该组的中间件 配置。 包含 CSRF 代币: 在表单中添加 @csrf 指令: <form name="app" action="storeSummons" enctype="multipart/form-data" method="post">@csrf</form> 检查路由缓存: 清除路由缓存:php artisan route:clear。 如果使用缓存机制,也清除那里的缓存。 回顾中间件: 检查应用于路由或组的中间件,确保它们不会干扰 - POST 请求。 检查浏览器开发者工具: 检查网络请求的路径和方法是否正确。 查找任何指示问题的错误或警告。
从数据库中选择 SELECT 选项后如何显示/隐藏 DIV?
这是选择选项的代码; 这是选择选项的代码; <div class="modal-body row"> <form role="form" action="patient/addNew" class="clearfix" method="post" enctype="multipart/form-data"> <div class="form-group col-md-6"> <label for="exampleInputEmail1"><?php echo lang('categorie'); ?></label> <select class="form-control m-bot15" name="categorie" value='' id="p_category"> <option value="#"> Sélectionner catégorie</option> <?php foreach ($categories as $category) { ?> <option value="category"><?php if (!empty($setval)) { if ($category->category == set_value('category')) { echo 'selected'; } } if (!empty($patient->category)) { if ($category->category == $patient->category) { echo 'selected'; } } ?> > <?php echo $category->category; ?> </option> <?php } ?> </select> </div> 这是必须显示/隐藏的 div: <label for="exampleInputEmail1"><?php echo lang('name_Us'); ?></label> <input type="text" class="form-control" name="name_husband" id="nameUs" placeholder=""> <label for="exampleInputEmail1"><?php echo lang('number_pre'); ?></label> <input type="number" class="form-control" name="number_pre" id="nbreEnf" placeholder=""> </div> 这是 JavaScript 代码: $('.divUs').hide(); $(document.body).on('change', '#p_category', function () { var v = $("select.p_category option:selected").val() if (v == 'Fe_Ence') { $('.divUs').show(); } else { $('.divUs').hide(); } }); }); 我希望如果选择了元素(Fe_Ence),则可以显示 div,否则,它保持隐藏 例如,您可以使用 :has 选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div id="thingtohide"> <h1>Hello</h1> </div> <div id="checkbox"> <input type="checkbox"> </div> <style> body:has(#checkbox input:checked) #thingtohide { visibility: hidden; } </style> </body> </html> 因此,如果父元素有一个选中的复选框,那么您可以定位与该父元素不同的子元素。
以下是选择选项的代码: 这是选择选项的代码: <div class="modal-body row"> <form role="form" action="patient/addNew" class="clearfix" method="post" enctype="multipart/form-data"> <div class="form-group col-md-6"> <label for="exampleInputEmail1"><?php echo lang('categorie'); ?></label> <select class="form-control m-bot15" name="categorie" value='' id="p_category"> <option value="#"> Sélectionner catégorie</option> <?php foreach ($categories as $category) { ?> <option value="category"><?php if (!empty($setval)) { if ($category->category == set_value('category')) { echo 'selected'; } } if (!empty($patient->category)) { if ($category->category == $patient->category) { echo 'selected'; } } ?> > <?php echo $category->category; ?> </option> <?php } ?> </select> </div> 这是应该显示/隐藏的 Div: <div class="form-group col-md-6" id="divCacher" style="display: none"> <label for="exampleInputEmail1"><?php echo lang('name_husband'); ?></label> <input type="text" class="form-control" name="name_Us" id="nameUs" placeholder=""> <label for="exampleInputEmail1"><?php echo lang('number_pregnancy'); ?></label> <input type="number" class="form-control" name="number_pregnancy" id="nbreEnfants" placeholder=""> </div> 这是 JavaScript 代码: $(document).ready(function () { $('.divCacher').hide(); $(document.body).on('change', '#p_category', function () { var v = $("select.p_category option:selected").val() if (v == 'Fe_Ence') { $('.divCacher').show(); } else { $('.divCacher').hide(); } }); }); 我希望如果我们选择 Fe_Ence 类别,则 div 会显示,否则,它会保持隐藏 您需要将 $category 设置为选项值更改此: <option value="category"> 对此: <option value="<?=$category?>"> 以下是适用于更多此类情况的示例: <!--SELECT INPUT--> <select id="p_category"> <option value=""> Sélectionner catégorie</option> <?php foreach ($categories as $category): ?> <option value="<?=$category?>"><?=$category?> <?php endforeach;?> </select> <!--Container List--> <div class="cat-container" data-id="test1"> <h1>This is Test1 Category</h1> </div> <div class="cat-container" data-id="Fe_Ence"> <h1>This is Fe_Ence Category</h1> </div> <div class="cat-container" data-id="test3"> <h1>This is test3 Category</h1> </div> // Javascript code checkCategory(); $("#p_category").on('change', checkCategory) function checkCategory() { $('.cat-container').hide() const selected = $('#p_category').val() if (!selected) return; $(`[data-id=${selected}`).show() }
我想使用最简单的方法通过jquery ajax上传文件。 我的代码是: ... 我想用最简单的方法通过jquery ajax上传文件。 我的代码是: <body> <form action="?" method="POST" enctype="multipart/form-data"> <input type="file" name="myfile" /><br> <input type="submit" name="submit_btn" value="Submit" /> </form> <div> <?php if (isset($_POST['submit'])) { //move_uploaded_files()... } ?> </div> </body> 当您使用网页上的表单向服务器发送数据时,您可以选择使用 GET 或 POST 方法。这些方法决定了数据如何发送到服务器。 当您将表单方法设置为 GET 时,您在表单字段中填写的数据(包括您选择的文件)会以某种方式添加到网址中。您可能已经注意到,当您提交表单时,浏览器中的 URL 会发生变化。然而,这种方法有一些局限性。它不适合发送大块数据(例如文件),并且以这种方式发送的数据量有最大限制。 另一方面,当您使用 POST 方法时,您输入表单的数据会以不同的方式发送,有点像后台的隐藏包。它更适合包含文件在内的大量数据。这就是当您将表单方法更改为 POST 时文件上传有效的原因。服务器知道如何处理此类数据并正确存储它。 在您的具体情况下,当您将表单方法更改为 GET 时,$_FILES 数组无法按预期工作,因为它旨在处理使用 POST 方法发送的数据。这有点像试图在方孔中安装圆钉 - GET 方法并非旨在像 POST 那样处理文件上传。 如果你确实需要使用GET方法并且仍然想上传文件,那就有点棘手了。您可能需要发挥创意,以可添加到 URL 的方式对文件数据进行编码,但由于各种问题,这并不是处理文件的最佳方式。 一般来说,对于文件上传,使用POST方法会更好。它确保您的文件安全地到达服务器,并避免尝试将像文件这样的大东西放入像 URL 这样的小空间中的复杂性。如果您决定使用 GET,您可能需要考虑不同的方法来实现您的目标,例如将文件临时存储在服务器上并通过 URL 传递对这些文件的引用。 那是因为 GET 请求没有正文,而这就是文件所在的位置