JQuery এর সাহায্যে কীভাবে রেডিও অপশন চেক করা হবে?
কোনও ডিফল্ট সেট না করা আছে কিনা তা পরীক্ষা করে ডিফল্ট সেট করা দরকার
উত্তর:
বলুন আপনার কাছে রেডিও বোতামগুলি ছিল যেমন, উদাহরণস্বরূপ:
<input type='radio' name='gender' value='Male'>
<input type='radio' name='gender' value='Female'>এবং যদি কোনও রেডিও চেক না করা হয় তবে আপনি "পুরুষ" অনলোডের মান সহ একটিটি পরীক্ষা করতে চেয়েছিলেন:
$(function() {
var $radios = $('input:radio[name=gender]');
if($radios.is(':checked') === false) {
$radios.filter('[value=Male]').prop('checked', true);
}
});$radios.removeAttr('checked')আগে ব্যবহার করবেন না । এটি ব্রাউজার এবং পোস্ট মানগুলিকে বিভ্রান্ত করবে।
কিভাবে একটি ওলাইনার?
$('input:radio[name="gender"]').filter('[value="Male"]').attr('checked', true);এটি ফর্ম.সেট () ব্যর্থতার কারণ ঘটবে:
$('input:radio[name=gender][value=Male]').attr('checked', true);তবে এটি কাজ করে:
$('input:radio[name=gender][value=Male]').click();জিক্যুরির রেডিও এবং চেকবক্সগুলির জন্য পরীক্ষিত স্থিতি নির্ধারণের দুটি উপায় রয়েছে এবং এটি আপনি এইচটিএমএল মার্কআপে মান বৈশিষ্ট্য ব্যবহার করছেন কিনা তার উপর নির্ভর করে:
$("[name=myRadio]").val(["myValue"]);$("#myRadio1").prop("checked", true);প্রথম ক্ষেত্রে, আমরা নাম ব্যবহার করে পুরো রেডিও গ্রুপটি নির্দিষ্ট করি এবং ভাল ফাংশন ব্যবহার করে নির্বাচন করতে রেডিও খুঁজে পেতে JQuery কে বলি। ভ্যাল ফাংশনটি 1-উপাদান অ্যারে নেয় এবং রেডিওটিকে মিলে যাওয়া মান সহ সন্ধান করে = সত্য সেট করে। একই নামের অন্যরা অনির্বাচিত হবে। যদি মিলে যাওয়া মান সহ কোনও রেডিও না পাওয়া যায় তবে সমস্তটি অনির্বাচিত হবে। যদি একই নাম এবং মান সহ একাধিক রেডিও থাকে তবে সর্বশেষটি নির্বাচন করা হবে এবং অন্যরা নির্বাচন থেকে বিচ্ছিন্ন হয়ে যাবে।
আপনি যদি রেডিওর জন্য মান অ্যাট্রিবিউট ব্যবহার না করে থাকেন তবে গ্রুপে নির্দিষ্ট রেডিও নির্বাচন করতে আপনাকে অনন্য আইডি ব্যবহার করতে হবে। এই ক্ষেত্রে, আপনাকে "চেক করা" সম্পত্তি সেট করতে প্রপ ফাংশন ব্যবহার করতে হবে। অনেক লোক চেকবক্সগুলির সাথে মান বৈশিষ্ট্য ব্যবহার করেন না তাই চেকবক্সগুলি তখন রেডিওগুলির জন্য # 2 আরও প্রযোজ্য। আরও মনে রাখবেন যে চেকবক্সগুলি একই নাম রাখলে গ্রুপ গঠন করে না, আপনি এটি করতে পারেন$("[name=myCheckBox").prop("checked", true); চেকবাক্সগুলির জন্য ।
আপনি এই কোডটি এখানে খেলতে পারেন: http://jsbin.com/OSULAtu/1/edit?html , আউটপুট
উত্তরটি আমি @ এমসি দ্বারা পছন্দ করেছি। আমি দেখতে পেয়েছি যে ফিল্টার () কলটি ব্যবহার না করার জন্য অভিব্যক্তিটি আরও ঘনীভূত হতে পারে (@ শাইকো দৃশ্যত এটিও লক্ষ্য করেছেন)। এছাড়াও, প্রপ () হ'ল জিকুয়েরি v1.6 + এর জন্য বনাম অ্যাট্রি () যাওয়ার উপায়, প্রপ () জন্য jQuery ডকুমেন্টেশন দেখুন সরকারী সেরা অনুশীলনের জন্য ।
@ পাওলো বার্গান্টিনোর উত্তর থেকে একই ইনপুট ট্যাগগুলি বিবেচনা করুন।
<input type='radio' name='gender' value='Male'>
<input type='radio' name='gender' value='Female'>আপডেট করা ওয়ান-লাইনার এমন কিছু পড়তে পারে:
$('input:radio[name="gender"][value="Male"]').prop('checked', true);আমি মনে করি আপনি ধরে নিতে পারেন, সেই নামটি অনন্য এবং গোষ্ঠীর সমস্ত রেডিওর একই নাম রয়েছে। তারপরে আপনি এর মতো jQuery সমর্থন ব্যবহার করতে পারেন:
$("[name=gender]").val(["Male"]);দ্রষ্টব্য: অ্যারে পাস করা গুরুত্বপূর্ণ।
শর্তযুক্ত সংস্করণ:
if (!$("[name=gender]:checked").length) {
$("[name=gender]").val(["Male"]);
}$("*")এটি ব্যবহার করছেন তা সমস্ত কিছুর সাথে মেলে যাতে আপনার কোনও প্রকার ইজারা $("input")বা আইডি ব্যবহার করা উচিত আইডির মাধ্যমে একটি উপাদান পাওয়ার জন্য ডোমের স্থানীয় কল রয়েছে বলে আদর্শ
document.querySelectorAllসমস্ত কাজ করে।
$("input[name=gender]")বা $("input[name=gender]:radio")(আধুনিক ব্রাউজারগুলির জন্য)$("input[name=gender][type=radio]")
আপনি যদি এটি সত্যই গতিশীল হতে চান এবং আগত ডেটার সাথে সঙ্গতিপূর্ণ রেডিও নির্বাচন করেন তবে এটি কাজ করে। এটি ডিফল্টে পাস করা বা ব্যবহার করা ডেটার লিঙ্গ মান ব্যবহার করে।
if(data['gender'] == ''){
$('input:radio[name="gender"][value="Male"]').prop('checked', true);
}else{
$('input:radio[name="gender"][value="' + data['gender'] +'"]').prop('checked', true);
};নেটিভ জেএস সমাধান:
document.querySelector('input[name=gender][value=Female]').checked = true;এইচটিএমএল:
<input type='radio' name='gender' value='Male'> Male
<input type='radio' name='gender' value='Female'>Femaleএবং আপনি যদি নিজের মডেল থেকে কোনও মান পাস করতে চান এবং ব্যবহারের চেয়ে মানের উপর ভিত্তি করে লোডের ভিত্তিতে গ্রুপ থেকে একটি রেডিও বোতামটি নির্বাচন করতে চান:
jQuery:
var priority = Model.Priority; //coming for razor model in this case
var allInputIds = "#slider-vertical-" + itemIndex + " fieldset input";
$(allInputIds).val([priority]); //Select at start upএবং এইচটিএমএল:
<div id="@("slider-vertical-"+Model.Id)">
<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
<input type="radio" name="@("radio-choice-b-"+Model.Id)" id="@("high-"+Model.Id)" value="1" checked="checked">
<label for="@("high-"+Model.Id)" style="width:100px">@UIStrings.PriorityHighText</label>
<input type="radio" name="@("radio-choice-b-"+Model.Id)" id="@("medium-"+Model.Id)" value="2">
<label for="@("medium-"+Model.Id)" style="width:100px">@UIStrings.PriorityMediumText</label>
<input type="radio" name="@("radio-choice-b-"+Model.Id)" id="@("low-"+Model.Id)" value="3">
<label for="@("low-"+Model.Id)" style="width:100px">@UIStrings.PriorityLowText</label>
</fieldset>
</div>সব দরকার নেই। সহজ এবং পুরানো এইচটিএমএল দিয়ে আপনি যা চান তা অর্জন করতে পারেন। আপনি যদি রেডিওটিকে ডিফল্টরূপে চেক করতে চান তবে:
<input type='radio' name='gender' checked='true' value='Male'>
পৃষ্ঠাটি লোড হয়ে গেলে এটি চেক হয়ে আসবে।
$("form input:[name=gender]").filter('[value=Male]').attr('checked', true);এখানে উপরোক্ত পদ্ধতিগুলির সাথে উদাহরণ দেওয়া হল:
<div class="ui-field-contain">
<fieldset data-role="controlgroup" data-type="horizontal"> <legend>Choose a pet:</legend>
<input type="radio" name="radio-choice-2" id="radio-choice-1" value="choice1">
<label for="radio-choice-1">Cat</label>
<input type="radio" name="radio-choice-2" id="radio-choice-2" value="choice2">
<label for="radio-choice-2">Dog</label>
<input type="radio" name="radio-choice-2" id="radio-choice-3" value="choice3">
<label for="radio-choice-3">Hamster</label>
<input type="radio" name="radio-choice-2" id="radio-choice-4" value="choice4">
<label for="radio-choice-4">Lizard</label>
</fieldset>
</div>জাভাস্ক্রিপ্টে:
$("[name = 'radio-choice-2'][value='choice3']").prop('checked', true).checkboxradio('refresh');রেডিও ইনপুট মানগুলি পাওয়ার সময় এই আচরণটি নোট করুন:
$('input[name="myRadio"]').change(function(e) { // Select the radio input group
// This returns the value of the checked radio button
// which triggered the event.
console.log( $(this).val() );
// but this will return the first radio button's value,
// regardless of checked state of the radio group.
console.log( $('input[name="myRadio"]').val() );
});সুতরাং $('input[name="myRadio"]').val()রেডিও ইনপুটটির চেক করা মানটি ফেরত দেয় না, যেমনটি আপনি আশা করতে পারেন - এটি প্রথম রেডিও বোতামটির মান প্রদান করে।
এটি Jquery obtiene একক এল উপাদান পরীক্ষা করা হয়েছে
$('input[name="radioInline"]:checked').val()// আপনি যদি এটি জাভাস্ক্রিপ্ট বা ব্যাকবোন জাতীয় কাঠামোতে করছেন, আপনি এটির মুখোমুখি হবেন আপনি এর মতো কিছু পেতে পারেন have
$MobileRadio = $( '#mobileUrlRadio' );যখন
$MobileRadio.checked = true;কাজ করবে না,
$MobileRadio[0].checked = true;ইচ্ছাশক্তি.
আপনার নির্বাচক উপরে প্রস্তাবিত অন্যান্য ছেলেদের হিসাবেও হতে পারে।
এটি একাধিক রেডিও বোতামের জন্য কাজ করে
$('input:radio[name="Aspirant.Gender"][value='+jsonData.Gender+']').prop('checked', true);