html - tag - এইচটিএমএল টিউটোরিয়াল




এইচটিএমএল চেকবক্সগুলি কি পাঠযোগ্যভাবে সেট করা যায়? (20)

আমি ক্লায়েন্ট নির্দিষ্ট পরিস্থিতিতে তাদের পরিবর্তন করতে সক্ষম হতে চান না।

সত্যিই নিজেই কাজ করবে না। আপনি কিছু ভয়াবহ W / CSS করতে সক্ষম হতে পারে কিন্তু আমরা সাধারণত তাদের কেবল অক্ষম করে।

সতর্কতা: তারা যদি পোস্ট করা হয় তবে ক্লায়েন্ট তাদের সময় পরিবর্তন করতে পারে। ব্যবহারকারীকে কিছু পরিবর্তন করতে বাধা দেওয়ার জন্য আপনি কেবলমাত্র পাঠ্য উপর নির্ভর করতে পারবেন না। সবসময় fiddler বা শুধু এইচটিএমএল w / firebug চেন বা কিছু জিনিস ব্যবহার করতে পারে।

আমি ভাবলাম তারা হতে পারে, কিন্তু আমার অর্থ এমন নয় যেখানে আমার মুখটি ছিল (তাই কথা বলতে) পঠনযোগ্য বৈশিষ্ট্য সেট করা আসলে কোনও কাজ বলে মনে হচ্ছে না।

আমি অক্ষম ব্যবহার করব না, যেহেতু আমি চেক ফর্মটি বাকি ফর্ম দিয়ে জমা দিতে চাই, তাই আমি ক্লায়েন্ট নির্দিষ্ট পরিস্থিতিতে তাদের পরিবর্তন করতে সক্ষম হবেন না।


অন্য কেউ যদি এমভিসি এবং একটি সম্পাদক টেমপ্লেট ব্যবহার করে তবে আমি কেবল একটি পঠনযোগ্য সম্পত্তি প্রদর্শন করতে নিয়ন্ত্রণ করি (আমি বিবৃতিতে মানটি পেতে একটি কাস্টম বৈশিষ্ট্য ব্যবহার করি)

@if (true)
{
    @Html.HiddenFor(m => m)
    @(ViewData.Model ? Html.Raw("Yes") : Html.Raw("No"))
} 
else
{               
    @Html.CheckBoxFor(m => m)
}

আমার সমাধান আসলে ফ্লাইসওয়াট এর সমাধানটির বিপরীত, তবে আমি নিশ্চিত নই যে এটি আপনার পরিস্থিতির জন্য কাজ করবে কিনা। আমার চেকবক্সগুলির একটি গোষ্ঠী আছে এবং প্রতিটিটিতে অন-ক্লিক হ্যান্ডলার রয়েছে যা ফর্মটি জমা দেয় (তারা একটি টেবিলে ফিল্টার সেটিংস পরিবর্তন করার জন্য ব্যবহৃত হয়)। আমি একাধিক ক্লিক মঞ্জুরি দিতে চাই না, যেহেতু প্রথম ক্লিকের পরে পরবর্তী ক্লিক উপেক্ষা করা হয়। তাই আমি প্রথম ক্লিকের পরে এবং ফর্মটি জমা দেওয়ার পরে সমস্ত চেকবক্সগুলি অক্ষম করি:

onclick="document.forms['form1'].submit(); $('#filters input').each(function() {this.disabled = true});"

চেকবক্সগুলি "ফিল্টার" এর আইডি সহ একটি স্প্যান উপাদানতে থাকে - কোডটির দ্বিতীয় অংশটি একটি jQuery বিবৃতি যা চেকবক্সগুলির মাধ্যমে পুনরাবৃত্তি করে এবং প্রতিটিটিকে অক্ষম করে। এইভাবে, চেকবক্স মান এখনও ফর্মের মাধ্যমে জমা দেওয়া হয়েছে (যেহেতু ফর্ম তাদের নিষ্ক্রিয় করার আগে জমা দেওয়া হয়েছিল), এবং এটি পৃষ্ঠাটি পুনরায় লোড না হওয়া পর্যন্ত ব্যবহারকারীকে তাদের পরিবর্তন থেকে আটকায়।


আমি কনোয়্যারপি এর উত্তরের উপর মন্তব্য করতে পারতাম, কিন্তু তার জন্য 50 টি খ্যাতি দরকার যা আমার নেই। আমি অন্য উত্তর পোস্ট যথেষ্ট খ্যাতি আছে। দুঃখিত।

কনোয়্যারপি এর উত্তরের সমস্যাটি হল চেকবক্সটি পৃষ্ঠাতে অন্তর্ভুক্ত না করেই পরিবর্তনযোগ্য নয়। যদিও ইলেক্ট্রন_অহয় যতটা নির্দিষ্ট করে না, ততই উত্তম উত্তরটি হ'ল এক পরিবর্তনযোগ্য চেকবাক্স একই রকম, যদি পরিবর্তনযোগ্য চেকবাক্সের মতো না হয়, যেমন "অক্ষম" বৈশিষ্ট্য প্রয়োগ করা হয়। ইলেকট্রন_অহয় দুটি কারণের সমাধান করে এমন একটি সমাধান যা "অক্ষম" বৈশিষ্ট্যটি ব্যবহার করতে চায় না তা অপরিহার্যভাবে অবৈধ নয় কারণ এটি "অক্ষম" বৈশিষ্ট্যটি ব্যবহার করে।

দুটি বুলিয়ান ভেরিয়েবল অনুমান করুন, $ চেক করা হয়েছে এবং $ অক্ষম করা হয়েছে:

if ($checked && $disabled)
    echo '<input type="hidden" name="my_name" value="1" />';
echo '<input type="checkbox" name="my_name" value="1" ',
    $checked ? 'checked="checked" ' : '',
    $disabled ? 'disabled="disabled" ' : '', '/>';

চেকবক্স চেক করা হয় যদি $ চেক করা সত্য হয়। $ চেক করা মিথ্যা যদি চেকবক্সটি অচিহ্নিত হিসাবে প্রদর্শিত হয়। যদি ব্যবহারকারী নিষ্ক্রিয় থাকে তবে ব্যবহারকারী চেকবক্সের অবস্থা পরিবর্তন করতে পারে। "My_name" প্যারামিটারটি ব্যবহারকারী দ্বারা না চেকবাক্সটি অচিহ্নিত হলে পোস্ট করা হয় না। "My_name = 1" পরামিতিটি চেকবাক্সটি চেক করা হলে ব্যবহারকারী দ্বারা বা না। আমি বিশ্বাস করি ইলেক্ট্রন_অহয় কি খুঁজছেন।


আমি নিচে প্রদত্ত সমাধান লক্ষ্য করেছি। এটি একই বিষয় জন্য আমার গবেষণা পাওয়া যায় নি। আমি এটা পোস্ট করেনি যারা কিন্তু এটা আমার দ্বারা তৈরি করা হয় না। এটা jQuery ব্যবহার করে:

$(document).ready(function() {
    $(":checkbox").bind("click", false);
});

এটি চেকবক্সগুলি শুধুমাত্র পঠনযোগ্য করে তুলবে যা ক্লায়েন্টকে পাঠযোগ্য তথ্য দেখানোর জন্য সহায়ক হবে।


আমি ফলাফল অর্জন করার জন্য এই ব্যবহার:

<input type=checkbox onclick="return false;" onkeydown="return false;" />

উপরের উত্তরগুলিতে যদি জাভাস্ক্রিপ্ট ব্যবহার করা হয় তবে সব ইনপুটগুলির জন্য এটি একটি ভাল সমাধান হতে পারে:

<script>
    $(function () {
        $('.readonly input').attr('readonly', 'readonly');
        $('.readonly textarea').attr('readonly', 'readonly');
        $('.readonly input:checkbox').click(function(){return false;});
        $('.readonly input:checkbox').keydown(function () { return false; });
    });
</script>

আমি শুধুমাত্র ASP.NET MVC এর সাথে কিছু ফর্ম উপাদান সেট করতে সেট করে এটি ব্যবহার করছি। উপরোক্ত পরিস্থিতিতে যেমন readonly হিসাবে কোনো পিতামাতার ধারক সেট করে উপরে লেখা এবং চেক বাক্সের জন্য কাজ করে।

<div class="editor-field readonly">
    <input id="Date" name="Date" type="datetime" value="11/29/2012 4:01:06 PM" />
</div>
<fieldset class="flags-editor readonly">
     <input checked="checked" class="flags-editor" id="Flag1" name="Flags" type="checkbox" value="Flag1" />
</fieldset>


এটি একটি চেকবাক্স যা আপনি পরিবর্তন করতে পারবেন না:

<input type="checkbox" disabled="disabled" checked="checked">

শুধু একটি অক্ষর হিসাবে disabled="disabled" যোগ করুন।


মন্তব্য ঠিকানা সম্পাদনা করুন:

যদি আপনি ডেটা পোস্ট করতে চান তবে সহজ সমাধানটি একই নামের একটি লুকানো ইনপুটতে প্রয়োগ করা হয়:

<input name="myvalue" type="checkbox" disabled="disabled" checked="checked"/>
<input name="myvalue" type="hidden" value="true"/>

এইভাবে, যখন চেকবক্সটি 'নিষ্ক্রিয়' তে সেট করা থাকে, এটি কেবলমাত্র তথ্যটিতে 'লিঙ্কযুক্ত' হওয়ার পরিবর্তে তথ্যটির একটি দৃশ্যমান উপস্থাপনায়ের উদ্দেশ্যকেই কাজে লাগায়। পিছনে পোস্টে, লুকানো ইনপুটের মান চেকবক্স নিষ্ক্রিয় অবস্থায় পাঠানো হচ্ছে।


এটি একটি ব্যবহারযোগ্যতা সমস্যা একটি বিট উপস্থাপন করে।

আপনি যদি একটি চেকবক্স প্রদর্শন করতে চান, তবে এটির সাথে যোগাযোগ না করা, কেন একটি চেকবাক্সও তারপর?

যাইহোক, আমার পদ্ধতিটি নিষ্ক্রিয় ব্যবহার করা হবে (ব্যবহারকারী একটি সক্রিয় চেকবক্সটি সম্পাদনযোগ্য নয় এমন পরিবর্তনের জন্য, JS সক্ষম করার পরিবর্তে কোনও কার্যকর কাজ করতে সক্ষম নয়), এবং একটি ফর্ম যোগ করুন যা জাভাস্ক্রিপ্ট ব্যবহার করে হ্যান্ডলার জমা দেয় যা ফর্মটি ঠিক আগে চেকবক্স সক্ষম করে জমা দেওয়া হয়েছে। এই ভাবে আপনি আপনার মান পোস্ট করুন।

অর্থাৎ এরকম কিছু

var form = document.getElementById('yourform');
form.onSubmit = function () 
{ 
    var formElems = document.getElementsByTagName('INPUT');
    for (var i = 0; i , formElems.length; i++)
    {  
       if (formElems[i].type == 'checkbox')
       { 
          formElems[i].disabled = false;
       }
    }
}

না, ইনপুট চেকবক্সগুলি কেবল পঠনযোগ্য নয়।

কিন্তু আপনি জাভাস্ক্রিপ্ট দিয়ে তাদের কেবল পাঠযোগ্য করতে পারেন!

চেকবক্সগুলি যেকোনো উপায়ে সংশোধন করা থেকে ব্যবহারকারীকে আটকিয়ে চেকবক্সগুলি কেবলমাত্র অনুমান হিসাবে কাজ করার জন্য যেকোনো সময় এই কোডটি যুক্ত করুন।

jQuery(document).on('click', function(e){
      // check for type, avoid selecting the element for performance
      if(e.target.type == 'checkbox') {
          var el = jQuery(e.target);
          if(el.prop('readonly')) {
              // prevent it from changing state
              e.preventDefault();
          }
      }
});
input[type=checkbox][readonly] {
    cursor: not-allowed;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label><input type="checkbox" checked readonly> I'm readonly!</label>

JQuery লোড করার পরে আপনি যে কোনো সময় এই স্ক্রিপ্ট যোগ করতে পারেন।

এটি গতিশীলভাবে যোগ উপাদান জন্য কাজ করবে।

এটি পৃষ্ঠার যে কোনও উপাদানতে ক্লিক ইভেন্টটি (পরিবর্তন ইভেন্টের আগে ঘটে) বাছাই করে কাজ করে, তা হলে এই উপাদানটি কেবল একটি পাঠযোগ্য চেকবক্স হয় কিনা তা পরীক্ষা করে এবং যদি তা হয় তবে এটি পরিবর্তনকে বাধা দেয়।

পৃষ্ঠার পারফরম্যান্সকে প্রভাবিত করে না এমন অনেকগুলি আইপি আছে।


পার্টিতে খুব দেরি হয়ে গেছে কিন্তু আমি এমভিসি (5) এর জন্য একটি উত্তর খুঁজে পেয়েছি চেকবক্সটি অক্ষম করেছি এবং চেকবাক্সের আগে একটি লুকানো ফোর যুক্ত করেছি, তাই যখন এটি পোস্ট করা হয় তখন লুকানো ক্ষেত্রটিকে প্রথমে খুঁজে বের করে এবং সেই মানটি ব্যবহার করে। এই কাজ করে।

 <div class="form-group">
     @Html.LabelFor(model => model.Carrier.Exists, new { @class = "control-label col-md-2" })
         <div class="col-md-10">
              @Html.HiddenFor(model => model.Carrier.Exists)
              @Html.CheckBoxFor(model => model.Carrier.Exists, new { @disabled = "disabled" })
              @Html.ValidationMessageFor(model => model.Carrier.Exists)
          </div>
 </div>

মানুষ শুধুমাত্র একটি পঠনযোগ্য চেক-বক্স চাই এবং (পাশাপাশি) শুধুমাত্র পঠনযোগ্য রেডিও-গ্রুপ পছন্দ করতে পারে তাই যে তথ্যটি পরিবর্তন করা যায় না সেটি ব্যবহারকারীর কাছে প্রবেশের ফর্মটিতে উপস্থাপন করা যেতে পারে।

ঠিক আছে অক্ষম এই কাজ করবে - দুর্ভাগ্যবশত নিষ্ক্রিয় নিয়ন্ত্রণগুলি কীবোর্ড নেভিগেটযোগ্য নয় এবং তাই সমস্ত অ্যাক্সেসযোগ্যতার বিধানের ফোল পড়ে। এটি হ'ল এইচটিএমএল এর সবচেয়ে বড় হ্যাঙ্গআপ যা আমি জানি।


যদি আপনি আপনার সমস্ত চেকবক্সগুলি "লক করা" চান তবে ব্যবহারকারী "পঠনযোগ্য" অ্যাটিবিউট উপস্থিত হলে "চেক করা" অবস্থা পরিবর্তন করতে পারবে না, তবে আপনি jQuery ব্যবহার করতে পারেন:

$(':checkbox').click(function () {
    if (typeof ($(this).attr('readonly')) != "undefined") {
        return false;
    }
});

এই কোড সম্পর্কে কুল জিনিসটি হল যে এটি আপনাকে প্রতি চেকবাক্সটি পুনর্বিবেচনা ছাড়াই আপনার সমস্ত কোডের "পাঠযোগ্য" বৈশিষ্ট্য পরিবর্তন করতে দেয়।

এটি পাশাপাশি রেডিও বাটন জন্য কাজ করে।


সার্ভারে একটি এইচটিএমএল চেকবাক্স পোস্ট করার সময়, এটি 'অন' বা '' এর স্ট্রিং মান রয়েছে।

Readonly ব্যবহারকারীকে চেকবাক্স সম্পাদনা করা বন্ধ করে না এবং অক্ষম করে মানটি পোস্ট করা বন্ধ করে দেয়।
এইরকম একটি উপায় হল একটি লুকানো উপাদানটি প্রকৃত মানটি সংরক্ষণ করার জন্য এবং প্রদর্শিত চেকবক্সটি একটি ডামি যা নিষ্ক্রিয়। এইভাবে চেকবক্স রাষ্ট্র পোস্টের মধ্যে স্থায়ী হয়।

এখানে এই কাজ একটি ফাংশন। এটি 'টি' বা 'F' এর একটি স্ট্রিং ব্যবহার করে এবং আপনি যে কোনও উপায়ে এটি পরিবর্তন করতে পারেন। এটি সার্ভার সাইড ভিবি স্ক্রিপ্ট ব্যবহার করে একটি ASP পৃষ্ঠাতে ব্যবহৃত হয়েছে।

public function MakeDummyReadonlyCheckbox(i_strName, i_strChecked_TorF)

    dim strThisCheckedValue

    if (i_strChecked_TorF = "T") then
        strThisCheckedValue = " checked "
        i_strChecked_TorF = "on"
    else
        strThisCheckedValue = ""
        i_strChecked_TorF = ""
    end if

    MakeDummyReadonlyCheckbox = "<input type='hidden' id='" & i_strName & "' name='" & i_strName & "' " & _
        "value='" & i_strChecked_TorF & "'>" & _
    "<input type='checkbox' disabled id='" & i_strName & "Dummy' name='" & i_strName & "Dummy' " & _
        strThisCheckedValue & ">"   
end function

public function GetCheckbox(i_objCheckbox)

    select case trim(i_objCheckbox)

        case ""
            GetCheckbox = "F"

        case else
            GetCheckbox = "T"

    end select

end function

একটি এসএসপি পৃষ্ঠার শীর্ষে আপনি স্থির মান পিকআপ করতে পারেন ...

strDataValue = GetCheckbox(Request.Form("chkTest"))

এবং যখন আপনি আপনার চেকবক্সটি আউটপুট করতে চান তখন আপনি এটি করতে পারেন ...

response.write MakeDummyReadonlyCheckbox("chkTest", strDataValue)

আমি এই পরীক্ষা করেছি এবং এটি ঠিক সূক্ষ্ম কাজ করে। এটা জাভাস্ক্রিপ্ট উপর নির্ভর করে না।


<input type="checkbox" onclick="return false" /> আপনার জন্য কাজ করবে, আমি এটি ব্যবহার করছি


onclick="javascript: return false;"

<input name="isActive" id="isActive" type="checkbox" value="1" checked="checked" onclick="return false"/>

<input type="checkbox" onclick="this.checked=!this.checked;">

কিন্তু আপনি একেবারে পরিবর্তন করা হয়েছে তা নিশ্চিত করার জন্য সার্ভারে তথ্য যাচাই করতে হবে।


<input type="checkbox" readonly="readonly" name="..." />

jquery সঙ্গে:

$(':checkbox[readonly]').click(function(){
            return false;
        });

এটি এখনও কিছু ভিজ্যুয়াল ইঙ্গিত (CSS, পাঠ্য, ...) দিতে একটি ভাল ধারণা হতে পারে, যে নিয়ন্ত্রণ ইনপুট গ্রহণ করবে না।





checkbox