আমি নিশ্চিত না এটি এমনকি সম্ভব কিনা। তবে আমি ভাবছিলাম যে হাইপারলিংক কীভাবে কিছু ভেরিয়েবল পাস করতে এবং জিইটির বিপরীতে পোষ্ট (ফর্মের মতো) ব্যবহার করতে হয় তা যদি কেউ জানে।
উত্তর:
আপনি লুকানো ইনপুট সহ একটি ফর্ম তৈরি করেন যা পোস্ট করা মানগুলিকে ধারণ করে, গন্তব্য url এ ফর্মটির ক্রিয়া সেট করে , এবং ফর্ম পদ্ধতি পোস্ট করতে । তারপরে, আপনার লিঙ্কটি ক্লিক করা হলে, ফর্মটি জমা দেয় এমন একটি জেএস ফাংশন ট্রিগার করুন।
উদাহরণস্বরূপ এখানে দেখুন । এই উদাহরণটি বিশুদ্ধ জাভাস্ক্রিপ্ট ব্যবহার করে, কোনও jQuery ছাড়াই - আপনি যদি ইতিমধ্যে আপনার চেয়ে আরও কিছু ইনস্টল না করতে চান তবে আপনি এটি চয়ন করতে পারেন।
<form name="myform" action="handle-data.php" method="post">
<label for="query">Search:</label>
<input type="text" name="query" id="query"/>
<button>Search</button>
</form>
<script>
var button = document.querySelector('form[name="myform"] > button');
button.addEventListener(function() {
document.querySelector("form[name="myform"]").submit();
});
</script>GET? আমরা getফর্ম ছাড়া ছিল , তাই না?
এর জন্য আপনার জাভাস্ক্রিপ্টের দরকার নেই। শুধু যে পরিষ্কার বর্ণনা করে দিতে, যেহেতু সময় যেমন এই উত্তর পোস্ট করা হয়েছে, চেয়েছিলেন সব এই প্রশ্নের উত্তর কিছু উপায় বা অন্য জাভাস্ক্রিপ্ট ব্যবহার জড়িত।
আপনি জমা দিতে চান এমন ডেটাযুক্ত গোপন ক্ষেত্রগুলি সহ একটি ফর্ম তৈরি করে খাঁটি এইচটিএমএল এবং সিএসএসের সাহায্যে এটি সহজেই করতে পারেন, তারপরে কোনও লিঙ্কের মতো দেখতে ফর্মের জমা বোতামটি স্টাইলিং করুন।
উদাহরণ স্বরূপ:
.inline {
display: inline;
}
.link-button {
background: none;
border: none;
color: blue;
text-decoration: underline;
cursor: pointer;
font-size: 1em;
font-family: serif;
}
.link-button:focus {
outline: none;
}
.link-button:active {
color:red;
}<a href="some_page">This is a regular link</a>
<form method="post" action="some_page" class="inline">
<input type="hidden" name="extra_submit_param" value="extra_submit_value">
<button type="submit" name="submit_param" value="submit_value" class="link-button">
This is a link that sends a POST request
</button>
</form>আপনার সাইটের সঠিক লিঙ্কগুলি কীভাবে আপনার সাইটে নিয়মিত লিঙ্কগুলি স্টাইল করা হয়েছে তার উপর নির্ভর করে আলাদা হতে পারে।
আপনি জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করতে পারেন। আপনি যদি এটি ব্যবহার করার সিদ্ধান্ত নেন তবে JQuery এর একটি সুন্দর পোস্ট ফাংশন রয়েছে:
<script language="javascript">
function DoPost(){
$.post("WhateverPage.php", { name: "John", time: "2pm" } ); //Your values here..
}
</script><a href="javascript:DoPost()">Click Here</A> $.post('page.php', {param: 1}, function() { window.location.href = 'page'.php' });
<a href="whyjavascript.html" id="postIt">Click Here</a>এবং করতে পারেন$("#postIt").on("click",function(e) { e.preventDefault(); $.post("WhateverPage.php", { name: "John", time: "2pm" } ); });
এটি একটি পুরানো প্রশ্ন, তবে কোনও উত্তরই পুরোপুরি অনুরোধটি পূরণ করে না। সুতরাং আমি অন্য উত্তর যুক্ত করছি।
অনুরোধ করা কোডটি, যেমনটি আমি বুঝতে পেরেছি, সাধারণ হাইপারলিঙ্কগুলি যেভাবে কাজ করে তাতে কেবল একটি পরিবর্তন করা POSTউচিত : পরিবর্তে পদ্ধতিটি ব্যবহার করা উচিত GET। তাত্ক্ষণিক প্রভাবগুলি হ'ল:
hrefPOSTআমি এখানে jquery ব্যবহার করছি, কিন্তু এটি নেটিস এপিআইএস দিয়ে করা যেতে পারে (আরও কঠিন এবং অবশ্যই)।
<html>
<head>
<script src="path/to/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$("a.post").click(function(e) {
e.stopPropagation();
e.preventDefault();
var href = this.href;
var parts = href.split('?');
var url = parts[0];
var params = parts[1].split('&');
var pp, inputs = '';
for(var i = 0, n = params.length; i < n; i++) {
pp = params[i].split('=');
inputs += '<input type="hidden" name="' + pp[0] + '" value="' + pp[1] + '" />';
}
$("body").append('<form action="'+url+'" method="post" id="poster">'+inputs+'</form>');
$("#poster").submit();
});
});
</script>
</head>
<body>
<a class="post" href="reflector.php?color=blue&weight=340&model=x-12&price=14.800">Post it!</a><br/>
<a href="reflector.php?color=blue&weight=340&model=x-12&price=14.800">Normal link</a>
</body>
</html>এবং ফলাফলটি দেখতে, নিম্নলিখিত ডিরেক্টরিটিকে একই রূপে প্রতিচ্ছবি হিসাবে সংরক্ষণ করুন ph
<h2>Get</h2>
<pre>
<?php print_r($_GET); ?>
</pre>
<h2>Post</h2>
<pre>
<?php print_r($_POST); ?>
</pre>পোস্টের অনুরূপ পদ্ধতির ব্যবহার করে আরেকটি কার্যকারী উদাহরণ: একটি এইচটিএমএল ফর্ম তৈরি করুন, পোস্টটি অনুকরণ করার জন্য জাভাস্ক্রিপ্ট ব্যবহার করুন। এটি 2 টি কাজ করে: একটি নতুন পৃষ্ঠায় ডেটা পোস্ট করুন এবং এটি একটি নতুন উইন্ডো / ট্যাবে খুলুন।
এইচটিএমএল
<form name='myForm' target="_blank" action='newpage.html' method='post'>
<input type="hidden" name="thisIsTheParameterName" value="testDataToBePosted"/>
</form>জাভাস্ক্রিপ্ট
document.forms["myForm"].submit();এইচটিএমএল + জ্যাকুয়ারি : একটি লিঙ্ক যা পোস্টের সাথে একটি লুকানো ফর্ম জমা দেয়।
যেহেতু আমি এই সমস্ত উত্তরগুলি বোঝার জন্য অনেক সময় ব্যয় করেছি এবং যেহেতু তাদের সবার কিছু আকর্ষণীয় বিশদ রয়েছে, তাই এখানে সম্মিলিত সংস্করণ যা শেষ পর্যন্ত আমার পক্ষে কাজ করেছে এবং যা এর সরলতার জন্য আমি পছন্দ করি।
আমার দৃষ্টিভঙ্গি আবার কোনও লুকানো ফর্ম তৈরি করা এবং পৃষ্ঠার অন্য কোনও লিঙ্কে ক্লিক করে এটি জমা দেওয়া। পৃষ্ঠার মূল অংশে ফর্মটি কোথায় রাখা হবে তা বিবেচ্য নয়।
ফর্মের জন্য কোড:
<form id="myHiddenFormId" action="myAction.php" method="post" style="display: none">
<input type="hidden" name="myParameterName" value="myParameterValue">
</form>বর্ণনা:
display: noneফর্ম লুকিয়ে রাখে। আপনি বিকল্পভাবে এটি একটি ডিভ বা অন্য কোনও উপাদানটিতে display: noneরেখে উপাদানটিতে সেট করতে পারেন ।
type="hidden"একটি fild যে দেখানো হবে না তৈরি করবে কিন্তু তার ডেটা কর্ম eitherways (প্রেরিত হবে W3C এর দেখতে )। আমি বুঝতে পারি যে এটি সহজতম ইনপুট প্রকার।
লিঙ্কের জন্য কোড:
<a href="" onclick="$('#myHiddenFormId').submit(); return false;" title="My link title">My link text</a>বর্ণনা:
খালি hrefকেবল একই পৃষ্ঠাটিকে লক্ষ্য করে । return falseব্রাউজারটি লিঙ্কটি অনুসরণ করা বন্ধ করে দেবে, তবে এই ক্ষেত্রে এটি আসল বিষয় নয় । আপনি অবশ্যই এই আচরণটি পরিবর্তন করতে চাইতে পারেন। আমার নির্দিষ্ট ক্ষেত্রে, ক্রিয়াটির শেষে একটি পুনঃনির্দেশ অন্তর্ভুক্ত।
onclickব্যবহার এড়িয়ে ব্যবহৃত হয় href="javascript:..."যেমন mplungjan দ্বারা লক্ষনীয় । $('#myHiddenFormId').submit();(পরিবর্তে একটি ফাংশন সংজ্ঞায়িত, যেহেতু কোড খুবই ছোট) ফর্ম জমা দিতে ব্যবহার করা হয়েছিল।
এই লিঙ্কটি অন্য যে কোনও <a>উপাদানগুলির মতো দেখতে হবে । আপনি প্রকৃতপক্ষে অন্য কোনও উপাদান ব্যবহার করতে পারেন <a>(উদাহরণস্বরূপ কোনও <span>বা কোনও চিত্র)।
আপনি এই jQuery ফাংশন ব্যবহার করতে পারেন
function makePostRequest(url, data) {
var jForm = $('<form></form>');
jForm.attr('action', url);
jForm.attr('method', 'post');
for (name in data) {
var jInput = $("<input>");
jInput.attr('name', name);
jInput.attr('value', data[name]);
jForm.append(jInput);
}
jForm.submit();
}জেএসফিডেলের একটি উদাহরণ এখানে রয়েছে ( http://jsfiddle.net/S7zUm/ )
অনেকগুলি পোস্টে উল্লিখিত হিসাবে, এটি সরাসরি সম্ভব নয়, তবে একটি সহজ এবং সফল উপায় নিম্নরূপ: প্রথমটি, আমরা আমাদের এইচটিএমএল পৃষ্ঠার শরীরে একটি ফর্ম রাখি, যার জমা দেওয়ার জন্য কোনও বোতাম নেই, এবং এর ইনপুটগুলিও লুকিয়ে আছে তারপরে আমরা ডেটা পেতে জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করি এবং ফর্মটি প্রেরণ করি। এই পদ্ধতির সুবিধাগুলির মধ্যে একটি হ'ল অন্য পৃষ্ঠাগুলিতে পুনর্নির্দেশ করা, যা সার্ভার-সাইড কোডের উপর নির্ভর করে। কোডটি নিম্নরূপ: এবং এখন যে কোনও জায়গায় আপনার "পোস্ট" পদ্ধতিতে থাকা দরকার:
<script type="text/javascript" language="javascript">
function post_link(data){
$('#post_form').find('#form_input').val(data);
$('#post_form').submit();
};
</script>
<form id="post_form" action="anywhere/you/want/" method="POST">
{% csrf_token %}
<input id="form_input" type="hidden" value="" name="form_input">
</form>
<a href="javascript:{}" onclick="javascript:post_link('data');">post link is ready</a>আমি পৃষ্ঠায় HTML কোডিং ছাড়াই আরও গতিশীল পদ্ধতির পরামর্শ দিচ্ছি, একে কঠোরভাবে জেএস রাখুন:
$("a.AS-POST").on('click', e => {
e.preventDefault()
let frm = document.createElement('FORM')
frm.id='frm_'+Math.random()
frm.method='POST'
frm.action=e.target.href
document.body.appendChild(frm)
frm.submit()
})জাভাস্ক্রিপ্ট ব্যবহার করার পরিবর্তে, আপনি একটি লুকানো ফর্ম প্রেরণকারী একটি লেবেলও ব্যবহার করতে পারেন। খুব সহজ এবং ছোট সমাধান। লেবেলটি আপনার এইচটিএমএলের যে কোনও জায়গায় থাকতে পারে।
<form style="display: none" action="postUrl" method="post">
<button type="submit" id="button_to_link"> </button>
</form>
<label style="text-decoration: underline" for="button_to_link"> link that posts </label>এটি আপনাকে সাহায্য করবে এটি পরীক্ষা করে দেখুন
$().redirect('test.php', {'a': 'value1', 'b': 'value2'});