এইচটিএমএল 5 নম্বর ইনপুট (ক্লায়েন্ট-পাশ) এ কমা পরিবর্তে দশমিক পয়েন্ট চাপুন

Question 1

আমি দেখেছি কিছু ব্রাউজার input type="number"সংখ্যার স্বরলিপি স্থানীয় করে তোলে।

সুতরাং এখন, যেখানে আমার অ্যাপ্লিকেশনটি দ্রাঘিমাংশ এবং অক্ষাংশ স্থানাঙ্ক প্রদর্শন করে, আমি "51,983" এর মতো স্টাফ পাই যেখানে এটি "51.982559" হওয়া উচিত। আমার কাজের মত ব্যবহার করা হয়input type="text" পরিবর্তে , তবে আমি দশমিকের সঠিক প্রদর্শন সহ নম্বর ইনপুটটি ব্যবহার করতে চাই।

কোন উপায় আছে? ক্লায়েন্ট-সাইড স্থানীয় সেটিংস নির্বিশেষে ব্রাউজারগুলিকে সংখ্যা ইনপুটটিতে দশমিক পয়েন্ট ব্যবহার করার বাধ্য ?

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

আগাম ধন্যবাদ.

আপডেট করুন এখনই হিসাবে, উইন্ডোজ on-তে ক্রোম সংস্করণ ২৮.০.১৫০০.71১ মিটার পরীক্ষা করে, সংখ্যা ইনপুটটি কমা দিয়ে ফর্ম্যাট করা দশমিকগুলি গ্রহণ করে না। stepবৈশিষ্ট্যটিরসাথে প্রস্তাবিত প্রস্তাবগুলি কার্যকরবলে মনে হচ্ছে না।

http://jsfiddle.net/ASJsj/

Question 2

বর্তমানে, ফায়ারফক্স এইচটিএমএল উপাদানটির ভাষাকে সম্মান করে যেখানে ইনপুটটি থাকে। উদাহরণস্বরূপ, ফায়ারফক্সে এই ঝাঁকুনিটি ব্যবহার করে দেখুন:

http://jsfiddle.net/ashraf_sabry_m/yzzhop75/1/

আপনি দেখতে পাবেন যে সংখ্যাগুলি আরবিতে রয়েছে এবং কমাটি দশমিক বিভাজক হিসাবে ব্যবহৃত হয়, এটি আরবীর ক্ষেত্রে। কারণ BODYট্যাগটি বৈশিষ্ট্য দেওয়া হয় becauselang="ar-EG" ।

এরপরে, এটি ব্যবহার করে দেখুন:

http://jsfiddle.net/ashraf_sabry_m/yzzhop75/2/

এইটি একটি দশমিক বিভাজক হিসাবে একটি বিন্দুর সাথে প্রদর্শিত হয় কারণ ইনপুট DIVপ্রদত্ত বৈশিষ্ট্যের সাথে আবৃত থাকেlang="en-US" ।

সুতরাং, আপনি যে সমাধানটি অবলম্বন করতে পারেন তা হ'ল আপনার সংখ্যার ইনপুটগুলিকে একটি ধারক উপাদান দিয়ে মোড়ানো যা দশমিক বিভাজক হিসাবে বিন্দু ব্যবহার করে এমন সংস্কৃতি ব্যবহার করতে সেট করা।

Question 3

আপনি যে দশমিকের চান তার যথার্থতার জন্য নির্দিষ্ট পদক্ষেপের বৈশিষ্ট্য এবং ল্যাং অ্যাট্রিবিউট [যা নির্দিষ্ট সময়ের সাথে দশমিককে ফর্ম্যাট করে এমন একটি লোকালে সেট করা হয় ] এর সাথে, আপনার এইচটিএমএল 5 সংখ্যার ইনপুট দশমিক গ্রহণ করবে। যেমন 10.56 এর মতো মান গ্রহণ করা; আমার অর্থ 2 দশমিক স্থান সংখ্যা, এটি করুন:

<input type="number" step="0.01" min="0" lang="en" value="1.99">

আপনি সর্বাধিক অনুমোদিতযোগ্য মানটির জন্য সর্বোচ্চ বৈশিষ্ট্যটি নির্দিষ্ট করতে পারেন specify

সম্পাদনা করুন একটি যোগ করুন ল্যাঙ একটি লোকেল মান ইনপুট উপাদান অ্যাট্রিবিউট যেগুলি কমা পরিবর্তে বিন্দু দিয়ে ফরম্যাটের দশমিক

Question 4

অনুমান অনুসারে , আপনি গুণকেরany মান হিসাবে ব্যবহার করতে পারেন step:

<input type="number" step="any">

Question 5

ইনপুটটিতে ল্যাং বৈশিষ্ট্য ব্যবহার করুন। আমার ওয়েব অ্যাপ্লিকেশন এফ_এফআর, ল্যাং = "এন_ইএন" ইনপুট নম্বরটিতে স্থানীয় এবং আমি উদাসীনভাবে একটি কমা বা বিন্দু ব্যবহার করতে পারি। ফায়ারফক্স সর্বদা একটি বিন্দু প্রদর্শন করে, ক্রোম কমা প্রদর্শন করে। তবে উভয় সিপার্টারই বৈধ।

Question 6

দুঃখের বিষয়, আধুনিক ব্রাউজারগুলিতে এই ইনপুট ক্ষেত্রের কভারেজটি খুব কম:

http://caniuse.com/#feat=input-number

অতএব, আমি ফ্যালব্যাকটি আশা করি এবং ক্ষেত্রটি সাধারণত গ্রহণ না করা অবধি কাজটি করার জন্য ভারী-প্রোগ্রামযুক্ত-লোডড ইনপুট [টাইপ = পাঠ্য] এর উপর নির্ভর করব।

এখনও অবধি কেবলমাত্র ক্রোম, সাফারি এবং অপেরার একটি ঝরঝরে বাস্তবায়ন রয়েছে তবে অন্যান্য সমস্ত ব্রাউজারগুলি বগি। তাদের মধ্যে কিছু, এমনকি দশমিকগুলি সমর্থন করে বলে মনে হয় না (বিবি 10 এর মতো)!

Question 7

আমি জানি না এটি সাহায্য করে তবে এই একই সমস্যার সন্ধান করার সময় আমি এখানে হোঁচট খেয়েছি, কেবলমাত্র একটি ইনপুট দৃষ্টিকোণ থেকে (যেমন আমি লক্ষ্য করেছি যে <input type="number" />মানটি টাইপ করার সময় আমার একটি কমা এবং একটি বিন্দু উভয়ই গ্রহণ করা হয়েছিল, তবে কেবল পরবর্তীটি ছিল আমি ইনপুটটিতে নির্ধারিত এঙ্গুলার মডেলকে আবদ্ধ হতে পারি)। সুতরাং আমি এই দ্রুত নির্দেশটি জোট করে সমাধান করেছি:

.directive("replaceComma", function() {
    return {
        restrict: "A",
        link: function(scope, element) {
            element.on("keydown", function(e) {
                if(e.keyCode === 188) {
                    this.value += ".";
                    e.preventDefault();
                }
            });
        }
    };
});

তারপরে, আমার এইচটিএমএলে, সহজভাবে: <input type="number" ng-model="foo" replace-comma />ব্যবহারকারীদের অবৈধ (জাভাস্ক্রিপ্টের অবস্থান থেকে, কোনও লোকেল নয়!) সংখ্যার ইনপুট থেকে রোধ করার জন্য অন-দ্য ফ্লাইটের সাথে কমা স্থাপন করবে। চিয়ার্স

Question 8

আমি একটি ব্লগ আর্টিকেল পেয়েছি যা দেখে মনে হয় এটি সম্পর্কিত কিছু ব্যাখ্যা করেছে:
HTML5 ইনপুট প্রকার = সংখ্যা এবং ক্রোমে দশমিক / ভাসমান

সংক্ষেপে:

stepবৈধ মানগুলির ডোমেনটি সংজ্ঞায়িত করতে সহায়তা করে
ডিফল্ট stepহয়1
সুতরাং ডিফল্ট ডোমেনটি হল পূর্ণসংখ্যা ( যদি দেওয়া হয় তবে এর মধ্যে minএবং maxঅন্তর্ভুক্ত)

আমি ধরে নেব যে দশমিক পয়েন্ট হিসাবে বনাম হাজার হাজার বিভাজক হিসাবে কমা ব্যবহার করার অস্পষ্টতা এবং এটি আপনার 51,983 প্রকৃতপক্ষে আশ্চর্যজনকভাবে পার্স করা একান্ন হাজার, নয়শো এবং আট-তিনটি।

স্পষ্টতই আপনি step="any"ডোমেনটিকে সমস্ত যুক্তিযুক্ত পরিসরে বিস্তৃত করতে ব্যবহার করতে পারেন , তবে আমি নিজে চেষ্টা করে দেখিনি। অক্ষাংশ এবং দ্রাঘিমাংশের জন্য আমি সফলভাবে ব্যবহার করেছি:

<input name="lat" type="number" min="-90.000000" max="90.000000" step="0.000001">
<input name="lon" type="number" min="-180.000000" max="180.000000" step="0.000001">

এটি সুন্দর নাও হতে পারে তবে এটি কাজ করে।

Question 9

যতদূর আমি এটি বুঝতে পারি, HTML5 input type="numberসর্বদা input.valueএকটি হিসাবে ফিরে আসে string।

স্পষ্টতই, input.valueAsNumberবর্তমান মানটি একটি ভাসমান পয়েন্ট নম্বর হিসাবে প্রদান করে। আপনি এটি চান একটি মান ফিরিয়ে দিতে এটি ব্যবহার করতে পারেন।

Http://diveintohtml5.info/forms.html#type-number দেখুন

Question 10

আপনি কি এর জন্য জাভাস্ক্রিপ্ট ব্যবহার বিবেচনা করেছেন?

$('input').val($('input').val().replace(',', '.'));

Question 11

একটি বিকল্প হ'ল javascript parseFloat()... কোনও "ইন্টেন্ট text chain" --> 12.3456পয়েন্ট সহ " কখনই পার্স করবেন না ...123456 (বিন্দুটি সরিয়ে দিন) একটি ফ্লোটে একটি পাঠ্য শৃঙ্খলা বিশ্লেষণ করুন ...

কোনও সার্ভারে এই কর্ডগুলি প্রেরণ করতে এটি একটি পাঠ্য শৃঙ্খলা প্রেরণ করুন। HTTPশুধুমাত্র প্রেরণTEXT

ক্লায়েন্টে ইনপুট কর্ডগুলি "" পার্সিংয়ের বাইরে রাখুনint " , পাঠ্য স্ট্রিং দিয়ে কাজ করুন

আপনি যদি পিএইচপি বা অনুরূপ সহ এইচটিএমএলগুলিতে কর্ডগুলি মুদ্রণ করেন ... পাঠ্যে ভেসে উঠুন এবং এইচটিএমএলে মুদ্রণ করুন

Question 12

1) 51,983 একটি স্ট্রিং টাইপ নম্বর কমা স্বীকার করে না

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

<input type="text" name="commanumber" id="commanumber" value="1,99" step='0.01' min='0' />

প্রতিস্থাপন .

এবং সংখ্যার প্রকারের বৈশিষ্ট্য পরিবর্তন করুন

$(document).ready(function() {
    var s = $('#commanumber').val().replace(/\,/g, '.');   
    $('#commanumber').attr('type','number');   
    $('#commanumber').val(s);   
});

পরীক্ষা করে দেখুন http://jsfiddle.net/ydf3kxgu/

আশা করি এটি আপনার সমস্যার সমাধান করে

Question 13

প্যাটার্ন ব্যবহার করুন

<input 
       type="number" 
       name="price"
       pattern="[0-9]+([\.,][0-9]+)?" 
       step="0.01"
       title="This should be a number with up to 2 decimal places."
>

শুভকামনা

Question 14

এটি করার জন্য আমি কোডের একটি কাস্টম টুকরো লিখেছি

আপনি প্রতিস্থাপন করতে চান ,সঙ্গে ., অপসারণ translate_decimals সম্পূর্ণরূপে ফাংশন।

var input = document.querySelector('input[role="custom-number"]');
var bincr = document.querySelector('button[role="increment"]');
var bdecr = document.querySelector('button[role="decrement"]');

function translate_decimals(side = 0)
{
	input.value = (side == ',' ? input.value.replace('.',',') : input.value.replace(',','.'));
}
translate_decimals(',');

bincr.addEventListener('click', ()=>{
	if (input.hasAttribute('max'))
	{
		if (input.value.substr(0,input.getAttribute('max').length) == input.getAttribute('max').substr(0,input.getAttribute('max').length))
		{
			return;
		}
		else
		{
			translate_decimals('.');
			let temp = input.value;
			input.value = "";
			input.value = (input.hasAttribute('step') ? (parseFloat(temp) + parseFloat(input.getAttribute('step'))) : temp++);
			translate_decimals(',');
		}
	}
});

bdecr.addEventListener('click', ()=>{
	if (input.hasAttribute('min'))
	{
		if (input.value.substr(0,input.getAttribute('min').length) == input.getAttribute('min').substr(0,input.getAttribute('min').length))
		{
			return;
		}
		else
		{
			translate_decimals('.');
			input.value = (input.hasAttribute('step') ? (input.value - input.getAttribute('step')) : input.value--);
			translate_decimals(',');
		}
	}
});

/* styling increment & decrement buttons */
button[role="increment"],
button[role="decrement"] {
	width:32px;
}

<input type="text" role="custom-number" step="0.01" min="0" max="0" lang="en" value="1.99">
<button role="increment">+</button>
<button role="decrement">-</button>

স্নিপেট প্রসারিত করুন

Question 15

আমার মান নিশ্চিত করতে হবে যে দশমিক বিভাজক হিসাবে বিন্দুর পরিবর্তে মানগুলি কমা দিয়ে প্রবেশ করা যেতে পারে। এটি একটি পুরানো সমস্যা বলে মনে হচ্ছে। এই লিঙ্কগুলি অনুসরণ করে পটভূমি তথ্য পাওয়া যাবে:

আমি অবশেষে কিছুটা jQuery দিয়ে সমাধান করেছি। অন চেঞ্জের সাথে কমাগুলি প্রতিস্থাপন করা হচ্ছে। এটি এখন পর্যন্ত সর্বশেষতম ফায়ারফক্স, ক্রোম এবং সাফারিতে ভাল কাজ করছে বলে মনে হচ্ছে।

$('input[type=number]').each(function () {

  $(this).change(function () {

    var $replace = $(this).val().toString().replace(/,/g, '.');

    $(this).val($replace);

  })

});

Question 16

এইচটিএমএল পদক্ষেপ বৈশিষ্ট্য ute

<input type="number" name="points" step="3">

উদাহরণ: যদি পদক্ষেপ = "3" হয় তবে আইনী সংখ্যাগুলি -3, 0, 3, 6 ইত্যাদি হতে পারে etc.

টিপ: ধাপের বৈশিষ্ট্যটি আইনি মানগুলির একটি সীমা তৈরি করতে সর্বাধিক এবং ন্যূনতম বৈশিষ্ট্যের সাথে একসাথে ব্যবহার করা যেতে পারে।

দ্রষ্টব্য: পদক্ষেপের বৈশিষ্ট্যটি নিম্নলিখিত ইনপুট ধরণের সাথে কাজ করে: সংখ্যা, ব্যাপ্তি, তারিখ, তারিখের সময়, তারিখ-স্থানীয়, মাস, সময় এবং সপ্তাহ।