উত্তর:
এক্সএইচটিএমএল 1.x ফর্মগুলি কেবল জিইটি এবং পোস্ট সমর্থন করে। GET এবং POST হ'ল "পদ্ধতি" বৈশিষ্ট্যের একমাত্র অনুমোদিত মান।
এইচটিএমএল স্ট্যান্ডার্ড অনুযায়ী আপনি পারবেন না । পদ্ধতি অ্যাট্রিবিউট জন্য কেবল বৈধ মান getএবং post, GET এবং পোষ্ট HTTP- র পদ্ধতি সংশ্লিষ্ট। <form method="put">অবৈধ এইচটিএমএল এবং এটির মতো আচরণ করা হবে <form>, অর্থাত্ একটি জিইটি অনুরোধ প্রেরণ করুন।
পরিবর্তে, অনেক ফ্রেমওয়ার্কগুলি HTTP পদ্ধতিটি সুড়ঙ্গ করার জন্য কেবল একটি পোষ্ট প্যারামিটার ব্যবহার করে:
<form method="post" ...>
<input type="hidden" name="_method" value="put" />
...অবশ্যই, এটির জন্য সার্ভার-সাইড আন-র্যাপিং দরকার।
এইচটিএমএল ফর্ম থেকে সার্ভারে ডেটা প্রেরণে কি আমি "পুট" পদ্ধতিটি ব্যবহার করতে পারি?
হ্যাঁ আপনি পারেন, তবে মনে রাখবেন এটির ফলস্বরূপ ফলাফল হবে না তবে জিইটি অনুরোধ হবে request আপনি যদি ট্যাগটির methodবৈশিষ্ট্যের জন্য একটি অবৈধ মান ব্যবহার করেন <form>তবে ব্রাউজারটি ডিফল্ট মানটি ব্যবহার করবে get।
এইচটিএমএল ফর্মগুলি (এইচটিএমএল সংস্করণ 4 (, 5 খসড়া পর্যন্ত) এবং এক্সএইচটিএমএল 1) কেবলমাত্র জিইটি এবং পোষ্টকে এইচটিটিপি অনুরোধ পদ্ধতি হিসাবে সমর্থন করে। এটির জন্য একটি কার্যপ্রণালী হ'ল পোস্টের মাধ্যমে অন্য পদ্ধতিগুলি একটি লুকানো ফর্ম ক্ষেত্রটি ব্যবহার করে সুড়ঙ্গ করা যা সার্ভার দ্বারা পড়া হয় এবং অনুরোধটি ততক্ষণে প্রেরণ করা হয়। এক্সএইচটিএমএল ২.০ একবার ফর্মগুলির জন্য জিইটি, পোস্ট, পুট এবং ডিলিটকে সমর্থন করার পরিকল্পনা করেছিল তবে এটি এইচটিএমএল 5 এর এক্সএইচটিএমএল 5-এ চলে যাচ্ছে , যা পুটকে সমর্থন করার পরিকল্পনা করে না। [আপডেট]
আপনি বিকল্পভাবে একটি ফর্ম প্রস্তাব করতে পারেন, তবে এটি জমা দেওয়ার পরিবর্তে জাভাস্ক্রিপ্টের সাহায্যে পুট পদ্ধতি ব্যবহার করে একটি এক্সএমএলএইচটিপিআরকেস্ট তৈরি এবং ফায়ার করতে পারেন।
PUT /resource।
HttpRequest.getParameterMap()ফর্মের প্যারামিটারগুলি ফিরে আসেনি।
_method লুকানো ক্ষেত্র workaround
নিম্নলিখিত ওয়েব কৌশলটি কয়েকটি ওয়েব ফ্রেমওয়ার্ক দ্বারা ব্যবহৃত হয়:
_methodGET বা পোস্ট নয় এমন কোনও ফর্মের সাথে একটি লুকানো প্যারামিটার যুক্ত করুন :
<input type="hidden" name="_method" value="PUT">এইচটিএমএল তৈরি সহায়তা সহায়ক পদ্ধতির মাধ্যমে ফ্রেমওয়ার্কগুলিতে এটি স্বয়ংক্রিয়ভাবে করা যেতে পারে।
প্রকৃত ফর্ম পদ্ধতিটি পোস্ট করুন ( <form method="post")
_methodসার্ভারে প্রক্রিয়া করে এবং ঠিক সেই পদ্ধতিটি করে যেমন প্রকৃত পোস্টের পরিবর্তে সেই পদ্ধতিটি প্রেরণ করা হয়েছিল
আপনি এটি এ অর্জন করতে পারেন:
form_tag@method("PATCH")নীতি / কেন এটা বিশুদ্ধ HTML এ সম্ভব নয় এর ইতিহাস: /software/114156/why-there-are-no-put-and-delete-methods-in-html-forms
@method("PATCH")
POSTএবং আপনার আসলে যা প্রয়োজন তা নয়।
দুর্ভাগ্যক্রমে, আধুনিক ব্রাউজারগুলি HTTP PUT অনুরোধগুলির জন্য স্থানীয় সমর্থন সরবরাহ করে না। এই সীমাবদ্ধতার আশেপাশে কাজ করার জন্য, আপনার এইচটিএমএল ফর্মের পদ্ধতির বৈশিষ্ট্যটি "পোস্ট" রয়েছে তা নিশ্চিত করুন, তারপরে আপনার HTML ফর্মটিতে কোনও পদ্ধতি ওভাররাইড পরামিতি যুক্ত করুন:
<input type="hidden" name="_METHOD" value="PUT"/>আপনার অনুরোধগুলি পরীক্ষা করতে আপনি "পোস্টম্যান" একটি গুগল ক্রোম এক্সটেনশন ব্যবহার করতে পারেন
পদ্ধতিগুলি সেট করার জন্য PUT এবং মুছে ফেলুন আমি নিম্নলিখিত হিসাবে সম্পাদন করি:
<form
method="PUT"
action="domain/route/param?query=value"
>
<input type="hidden" name="delete_id" value="1" />
<input type="hidden" name="put_id" value="1" />
<input type="text" name="put_name" value="content_or_not" />
<div>
<button name="update_data">Save changes</button>
<button name="remove_data">Remove</button>
</div>
</form>
<hr>
<form
method="DELETE"
action="domain/route/param?query=value"
>
<input type="hidden" name="delete_id" value="1" />
<input type="text" name="delete_name" value="content_or_not" />
<button name="delete_data">Remove item</button>
</form>তারপরে জেএস পছন্দসই পদ্ধতিগুলি সম্পাদন করে:
<script>
var putMethod = ( event ) => {
// Prevent redirection of Form Click
event.preventDefault();
var target = event.target;
while ( target.tagName != "FORM" ) {
target = target.parentElement;
} // While the target is not te FORM tag, it looks for the parent element
// The action attribute provides the request URL
var url = target.getAttribute( "action" );
// Collect Form Data by prefix "put_" on name attribute
var bodyForm = target.querySelectorAll( "[name^=put_]");
var body = {};
bodyForm.forEach( element => {
// I used split to separate prefix from worth name attribute
var nameArray = element.getAttribute( "name" ).split( "_" );
var name = nameArray[ nameArray.length - 1 ];
if ( element.tagName != "TEXTAREA" ) {
var value = element.getAttribute( "value" );
} else {
// if element is textarea, value attribute may return null or undefined
var value = element.innerHTML;
}
// all elements with name="put_*" has value registered in body object
body[ name ] = value;
} );
var xhr = new XMLHttpRequest();
xhr.open( "PUT", url );
xhr.setRequestHeader( "Content-Type", "application/json" );
xhr.onload = () => {
if ( xhr.status === 200 ) {
// reload() uses cache, reload( true ) force no-cache. I reload the page to make "redirects normal effect" of HTML form when submit. You can manipulate DOM instead.
location.reload( true );
} else {
console.log( xhr.status, xhr.responseText );
}
}
xhr.send( body );
}
var deleteMethod = ( event ) => {
event.preventDefault();
var confirm = window.confirm( "Certeza em deletar este conteúdo?" );
if ( confirm ) {
var target = event.target;
while ( target.tagName != "FORM" ) {
target = target.parentElement;
}
var url = target.getAttribute( "action" );
var xhr = new XMLHttpRequest();
xhr.open( "DELETE", url );
xhr.setRequestHeader( "Content-Type", "application/json" );
xhr.onload = () => {
if ( xhr.status === 200 ) {
location.reload( true );
console.log( xhr.responseText );
} else {
console.log( xhr.status, xhr.responseText );
}
}
xhr.send();
}
}
</script>এই ফাংশনগুলি সংজ্ঞায়িত করে, আমি বোতামগুলিতে একটি ইভেন্ট শ্রোতা যুক্ত করি যা ফর্ম পদ্ধতি অনুরোধ করে:
<script>
document.querySelectorAll( "[name=update_data], [name=delete_data]" ).forEach( element => {
var button = element;
var form = element;
while ( form.tagName != "FORM" ) {
form = form.parentElement;
}
var method = form.getAttribute( "method" );
if ( method == "PUT" ) {
button.addEventListener( "click", putMethod );
}
if ( method == "DELETE" ) {
button.addEventListener( "click", deleteMethod );
}
} );
</script>এবং পুট ফর্মের অপসারণ বোতামের জন্য:
<script>
document.querySelectorAll( "[name=remove_data]" ).forEach( element => {
var button = element;
button.addEventListener( "click", deleteMethod );
</script>_ - - - - - - - - - - -
এই নিবন্ধটি https://blog.garstasio.com/you-dont-need-jquery/ajax/ আমাকে অনেক সাহায্য করে!
এর বাইরে, আপনি পোস্টমেইথড ফাংশন সেট করতে পারেন এবং পোস্টমথল পরিচালনা করতে গেটমথোড এবং আপনার পরিবর্তে ব্রাউজারের ডিফল্ট আচরণ পছন্দ করতে পদ্ধতিগুলি জমা দিতে পারেন। পরিবর্তে আপনি যা ব্যবহার করতে চান তা করতে পারেন location.reload(), যেমন সফল পরিবর্তন বা সফল মোছার বার্তা প্রদর্শন করুন।
= - = - = - = - = - = - = - = - = - = - = - = - = - = - = - = - = - = -