اذهب إلى المحتوى
  • 0

قراءة قيم من حقول الإدخال واختبار عدم خلوها من القيمة باستعمال jquery

Hafsa Aly

السؤال

لدي modal به 2 inputs اريد ادخال قيم بالinputs وعند عمل sumit  لنموذج المودال تقوم بتغيير هذه القيم مباشرة بعناصر في كودhtmlاريد تحديد الخطا في هذا الكود

 $(document).ready(function(){
        $("#myModal").modal('show');
        $('#form1').submit(function(e){
            e.preventDefault();
            var num1 = $('#text1').val();
            var num2 = $('#text2').val();
            if(num1 & num2 != null){
                $('#demo1').text('num1');
                $('#demo2').text('num2');
            }
        });

    });

 

تم التعديل في بواسطة Wael Aljamal
توضيح السؤال
رابط هذا التعليق
شارك على الشبكات الإجتماعية

Recommended Posts

  • 0

كتابة الشرط خطأ، يجب أن تكون بهذه الطريقة:

  • كل عدد نختبره بنفسه
  • عند إضافة القيمة لا نضع اقتباس حول num1 في الدالة text 
if(num1 != null && num2 != null){
	$('#demo1').text(num1);
	$('#demo2').text(num2);
}

لأن num1 & num2 != null تعمل عملية bitwise and أي عملية الضرب المنطقي (يعيد 1 في حال جداء بتين متقابلين لهما قيمة 1)

0  0  1  1    operand1
0  1  0  1    operand2
----------
0  0  0  1    result = operand1 & operand2

أي الشرط لديك لا يمثل تحقق الشرط في حال كان كلا العديين لا يساوي null ..

من موسوعة حسوب:

اقتباس

 

يُجرِي المعامل & في لغة البرمجة العملية AND على كل بتين متقابلين من بتات العددين المعطيين بشكل مستقل ويعطي القيمة العددية الناتجة. وفقًا لهذا التعريف، إن كانت قيمة كلا البتَّين 1، فالقيمة الناتجة عن تطبيق العملية AND عليهما هي 1؛ خلا ذلك، ستكون القيمة الناتج هي 0.

 

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 2 ساعات قال محمد أبو عواد:

هل يمكنك ارفاق الكود بعد التعديل؟

 $(document).ready(function(){
        $("#myModal").modal('show');
        $('#form1').submit(function(){
            // e.preventDefault();
            var num1 = $('#text1').val();
            var num2 = $('#text2').val();
            if(num1 != null && num2 != null){
                $('#demo1').html('num1');
                $('#demo2').html('num2');
            }
        });

    });

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ الآن قال Hafsa Aly:

 $(document).ready(function(){
        $("#myModal").modal('show');
        $('#form1').submit(function(){
            // e.preventDefault();
            var num1 = $('#text1').val();
            var num2 = $('#text2').val();
            if(num1 != null && num2 != null){
                $('#demo1').html('num1');
                $('#demo2').html('num2');
            }
        });

    });

 

بداية هذا عبارة عن نموذج وعند عمل submit له يتم تحديث الصفحة , ولذلك يجب ازالة التعليق عن السطر 

// e.preventDefault();

ليصبح كالتالي

e.preventDefault();

ثانيا في السطرين 

                $('#demo1').html('num1');
                                 ^^^^^^^
                $('#demo2').html('num2');
                                 ^^^^^^^

لا نضع المتغير بداخل علامتي تنصيص , أرجو منك تعديل الكود كالتالي

                $('#demo1').html(num1);
                                 ^^^^^^^
                $('#demo2').html(num2);
                                 ^^^^^^^

ثالثا عمل submit للفورم لن يختفي العنصر modal , لذلك بعد انتهاء العملية سوف نقوم باخفاء العنصر Modal من خلال عمل له hide كالتالي

$("#myModal").modal('hide');

يصبح الكود كالتالي

         $(document).ready(function(){
        $("#myModal").modal('show');
        $('#form1').submit(function(e){
            e.preventDefault();
            var num1 = $('#text1').val();
            var num2 = $('#text2').val();
            if(num1 != null && num2 != null){
                $('#demo1').html(num1);
                $('#demo2').html(num2);
            }
            $("#myModal").modal('hide');
        });

    });

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 5 دقائق مضت قال محمد أبو عواد:

بداية هذا عبارة عن نموذج وعند عمل submit له يتم تحديث الصفحة , ولذلك يجب ازالة التعليق عن السطر 


// e.preventDefault();

ليصبح كالتالي


e.preventDefault();

ثانيا في السطرين 


                $('#demo1').html('num1');
                                 ^^^^^^^
                $('#demo2').html('num2');
                                 ^^^^^^^

لا نضع المتغير بداخل علامتي تنصيص , أرجو منك تعديل الكود كالتالي


                $('#demo1').html(num1);
                                 ^^^^^^^
                $('#demo2').html(num2);
                                 ^^^^^^^

ثالثا عمل submit للفورم لن يختفي العنصر modal , لذلك بعد انتهاء العملية سوف نقوم باخفاء العنصر Modal من خلال عمل له hide كالتالي


$("#myModal").modal('hide');

يصبح الكود كالتالي


         $(document).ready(function(){
        $("#myModal").modal('show');
        $('#form1').submit(function(e){
            e.preventDefault();
            var num1 = $('#text1').val();
            var num2 = $('#text2').val();
            if(num1 != null && num2 != null){
                $('#demo1').html(num1);
                $('#demo2').html(num2);
            }
            $("#myModal").modal('hide');
        });

    });

 

شكرا لك

لدي فقط سؤال اخر هل بامكاني اضافة select control  ايضا للمودال ومن ثم يتم ادخال القيمه المختارة في عنصر داخل html

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ الآن قال Hafsa Aly:

شكرا لك

لدي فقط سؤال اخر هل بامكاني اضافة select control  ايضا للمودال ومن ثم يتم ادخال القيمه المختارة في عنصر داخل html

نعم بامكانك ذلك بنفس الطريقة المستخدمة مع حقول الادخال

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 21 ساعات قال محمد أبو عواد:

نعم بامكانك ذلك بنفس الطريقة المستخدمة مع حقول الادخال

ارجو منك توضيح دور هذه الداله جيدا لاني لم افهمها

e.preventDefault();

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 11 دقائق مضت قال Hafsa Aly:

ارجو منك توضيح دور هذه الداله جيدا لاني لم افهمها

e.preventDefault();

يتم استخدام الدالة PreventionDefault () لمنع المتصفح من تنفيذ الإجراء الافتراضي للعنصر المحدد. فمثلا الاجراء الافتراضي لعنصر form هو عند عمل submit له يتم تحديث المتصفح وارسال البيانات الى الخادم , هذا السطر يمنع حدوث ذلك , لذلك عندما كان السطر تعليق كان يتم تنفي اجراء submit بشكل طبيعي وبالتالي تحديث الصفحة وبالتالي اختفاء القيم بسرعة

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ منذ ساعة مضت قال محمد أبو عواد:

يتم استخدام الدالة PreventionDefault () لمنع المتصفح من تنفيذ الإجراء الافتراضي للعنصر المحدد. فمثلا الاجراء الافتراضي لعنصر form هو عند عمل submit له يتم تحديث المتصفح وارسال البيانات الى الخادم , هذا السطر يمنع حدوث ذلك , لذلك عندما كان السطر تعليق كان يتم تنفي اجراء submit بشكل طبيعي وبالتالي تحديث الصفحة وبالتالي اختفاء القيم بسرعة

هل استطيع باستخدام jquery  ان اجعل الفورم تقوم بالعمل الافتراضي لها اقصد بان انقل البيانات الى صفحة اخرى 

اي عند عمل  submit  للفورم يتم تحديث المتصفح ونقل البيانات الى صفحة اخرى 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 1 دقيقة مضت قال Hafsa Aly:

هل استطيع باستخدام jquery  ان اجعل الفورم تقوم بالعمل الافتراضي لها اقصد بان انقل البيانات الى صفحة اخرى 

اي عند عمل  submit  للفورم يتم تحديث المتصفح ونقل البيانات الى صفحة اخرى 

بسهولة يمكننا عدم استخدام الدالة PreventionDefault () وسوف يقوم عنصر form بالتصرف الطبيعي له ولا حاجة ل jquery في هذه الحالة

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 21 دقائق مضت قال محمد أبو عواد:

بسهولة يمكننا عدم استخدام الدالة PreventionDefault () وسوف يقوم عنصر form بالتصرف الطبيعي له ولا حاجة ل jquery في هذه الحالة

نعم فهمتك ولكن في هذه الحالة المسار الطبيعي يطون كالتالي عند اظهار المودال يقم المستخدم بادخال قيم في الفورم ومن ثم ترسل الفورم البيانات الداتا بيز ومن ثم اقرا هذه البيانات من الداتابيز الى صفحة اخرى 

ولكن اذا اردت استبعاد الداتابيز ونقل البيانات الذي يدخلها المستخدم فورا الى صفحة اخرى 

واعتذر لكثرة الاسئلة

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 1 دقيقة مضت قال Hafsa Aly:

نعم فهمتك ولكن في هذه الحالة المسار الطبيعي يطون كالتالي عند اظهار المودال يقم المستخدم بادخال قيم في الفورم ومن ثم ترسل الفورم البيانات الداتا بيز ومن ثم اقرا هذه البيانات من الداتابيز الى صفحة اخرى 

ولكن اذا اردت استبعاد الداتابيز ونقل البيانات الذي يدخلها المستخدم فورا الى صفحة اخرى 

واعتذر لكثرة الاسئلة

بالنسبة لأول جملة نعم صحيحة وهذا التصرف الطبيعي لعنصر form , بالنسبة للجملة الثانية لم أفهمها

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 1 دقيقة مضت قال محمد أبو عواد:

بالنسبة لأول جملة نعم صحيحة وهذا التصرف الطبيعي لعنصر form , بالنسبة للجملة الثانية لم أفهمها

اقصد اريد ان اجعل البيانات التي يتم ادخالها من خلال المودال او الفورم عند عمل  submit  لها يتم نقلها الى صفحة اخرى مباشرة وتحديث المتصفح

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ الآن قال Hafsa Aly:

اقصد اريد ان اجعل البيانات التي يتم ادخالها من خلال المودال او الفورم عند عمل  submit  لها يتم نقلها الى صفحة اخرى مباشرة وتحديث المتصفح

هادا الوضع الطبيعي لعمل عنصر الفورم , وليس المكون المودال , المكون المودال هو مكون جاهز من بوتستراب فقط ويمكننا وضع فيه ما نشاء من العناصر, من ضمن العناصر التي يمكننا وضعها بداخل المكون مودال هو عنصر فورم, عنصر فورم يستخدم لادخال بيانات وعند عمل submit للفورم يتم الذهاب الى مسار معين , هذا المسار اما الهدف منه عملية جلب بيانات من قاعدة بيانات أو تخزين البيانات في قاعدة البيانات , عند عمل submit للفورم يتم بالتأكيد تحديث الصفحة 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...