שליחת הודעות שגיה לצד לקוח - בעיה
-
היי
יש לי בצד שרת קוד PHP ששולח שגיאות אם קיימות בטופס:// Return any validation errors for the first step without proceeding if(count($errors) > 0) { header('Content-Type: application/json'); echo json_encode(['errors' => $errors, 'db_errors' => $db_errors]); exit; }ובצד לקוח קוד שאמור להציג אותם:
<script> $(document).ready(function() { $('.next').click(function(e) { e.preventDefault(); // Get the current tab var currentTab = $('.tab-pane.active').attr('id'); console.log('Submitting form: ' + currentTab); // Debugging line // Determine the correct form id based on the current tab var formId; switch(currentTab) { case 'first': formId = 'profileForm'; break; case 'second': formId = 'bizForm'; break; //case 'third': //formId = 'otherForm'; //break; } // Delay the serialization and the AJAX request setTimeout(function() { // Serialize the form data var formData = $('#' + formId).serializeArray(); console.log('Serialized form data: ', formData); // Debugging line $.ajax({ type: "POST", url: "validation.php", data: { 'form': currentTab, 'formData': formData }, success: function(data) { console.log('Server response: ', data); // Debugging line // Check if there are any errors if (data.errors && Object.keys(data.errors).length > 0) { // Log the errors for debugging console.error('Validation errors:', data.errors); // Display each error using the toast plugin for(var key in data.errors) { if(data.errors.hasOwnProperty(key)) { $.toast({ heading: 'Error', text: data.errors[key], // get the error message using the key hideAfter: 8000, // in milli seconds showHideTransition: 'slide', stack: 3, position: 'mid-center', icon: 'warning', bgColor: '#FFC800', loaderBg: '#FF9F00', // To change the background textColor: 'white', textAlign: 'left' }); } } } else if (data.success) { // If success is true, display success message and/or move to next tab console.log('Form submission successful'); // Your code to switch to the next tab or show a success message } } }); }, 500); // 500 ms delay }); }); </script>בקונסולה לא מופיע , לא:
console.error('Validation errors:', data.errors);וגם לא:
console.log('Form submission successful');מה שואמר ששני התנאים לא מתקמיים, אשמח לעזרה אם מישהו יכול להבין את הבעיה, מדוע לא מופיעות שגיאות ומדוע לא מופיעה בקונסולה אחת משני ההודעות.
תודה רבה
-
אתה צריך ללמוד להסתכל בNetwork שבכלי המפתחים.
מה השורה הזו:console.log('Server response: ', data); // Debugging lineפולטת?
ההתניה שלך מניחה ש: או שיש אובייקט data.errors עם ערכים, או שיש success. מהקוד של הphp שם רואים שאתה מנסה לשלוח שגיאות לא מוכרח שאין אפשרות שלישית.
-
-
@dovid
אשמח לשתף.
זה הפלט, כמה שגיאות שלמיטב ידיעתי לא קשורות ונתוני הטופס:VM362:8338 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'facebook.json') at getConfig (<anonymous>:8338:42) at ClickToLoad.init (<anonymous>:11132:37) at ClickToLoad.callInit (<anonymous>:3180:18) at <anonymous>:11424:33 at Array.forEach (<anonymous>) at Object.init (<anonymous>:11422:26) getConfig @ VM362:8338 init @ VM362:11132 callInit @ VM362:3180 (anonymous) @ VM362:11424 init @ VM362:11422 await in init (async) apply @ VM362:11490 (anonymous) @ VM371:3 (anonymous) @ VM371:5 inject @ inject.js:114 (anonymous) @ inject.js:208 Show 2 more frames Show less vendor.min.js:24892 Uncaught TypeError: Cannot read properties of undefined (reading 'length') at Object.getRegexMask (vendor.min.js:24892:404) at l.init (vendor.min.js:24899:27) at new n (vendor.min.js:24899:418) at HTMLInputElement.k (vendor.min.js:24901:227) at Function.each (vendor.min.js:381:19) at jQuery.fn.init.each (vendor.min.js:203:17) at a.fn.mask (vendor.min.js:24901:253) at HTMLInputElement.<anonymous> (app.min.js:1:11969) at Function.each (vendor.min.js:381:19) at jQuery.fn.init.each (vendor.min.js:203:17) getRegexMask @ vendor.min.js:24892 l.init @ vendor.min.js:24899 n @ vendor.min.js:24899 k @ vendor.min.js:24901 each @ vendor.min.js:381 each @ vendor.min.js:203 a.fn.mask @ vendor.min.js:24901 (anonymous) @ app.min.js:1 each @ vendor.min.js:381 each @ vendor.min.js:203 t.initMask @ app.min.js:1 t.init @ app.min.js:1 t.init @ app.min.js:1 (anonymous) @ app.min.js:1 (anonymous) @ app.min.js:1 vendors.js:58 Refused to load the script 'https://js.stripe.com/v3' because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval' 'inline-speculation-rules'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback. (anonymous) @ vendors.js:58 (anonymous) @ vendors.js:58 N @ vendors.js:58 (anonymous) @ vendors.js:58 Promise.then (async) 65085 @ vendors.js:58 o @ content-script.js:7411 95133 @ vendors.js:58 o @ content-script.js:7411 86493 @ vendors.js:401 o @ content-script.js:7411 5309 @ content-script.js:1118 o @ content-script.js:7411 (anonymous) @ content-script.js:7411 o.O @ content-script.js:7411 t @ content-script.js:7411 (anonymous) @ vendors.js:2 Show 16 more frames Show less vendors.js:58 Error: Failed to load Stripe.js at HTMLScriptElement.<anonymous> (vendors.js:58:1979) (anonymous) @ vendors.js:58 Promise.catch (async) 65085 @ vendors.js:58 o @ content-script.js:7411 95133 @ vendors.js:58 o @ content-script.js:7411 86493 @ vendors.js:401 o @ content-script.js:7411 5309 @ content-script.js:1118 o @ content-script.js:7411 (anonymous) @ content-script.js:7411 o.O @ content-script.js:7411 t @ content-script.js:7411 (anonymous) @ vendors.js:2 Show 13 more frames Show less null:1 GET https://stockermart.com/GOODIES/null 404 (Not Found) goodies_enrollment.php:406 Submitting form: first goodies_enrollment.php:426 Serialized form data: (11) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]0: {name: 'Company_Name', value: '%'}1: {name: 'Company_number', value: '955555555'}2: {name: 'type_business', value: 'חנות קמעונאית'}3: {name: 'City', value: 'לוד'}4: {name: 'Address', value: 'יע'}5: {name: 'Zip', value: '0023453'}6: {name: 'contact', value: 'מורדכי'}7: {name: 'Company_phone', value: '055-555-5555'}8: {name: 'Company_phone2', value: '055-555-5555'}9: {name: 'Company_email', value: 'd@gmail.com'}10: {name: 'business_size', value: '31-100'}length: 11[[Prototype]]: Array(0) goodies_enrollment.php:406 Submitting form: second goodies_enrollment.php:426 Serialized form data: [{…}]0: {name: 'biz_type', value: 'מזומן'}length: 1[[Prototype]]: Array(0)ניתן לראות ששם החברה אינו תקין, כי רשום %, וסקריפט האימות שלו אינו מאפשר את זה:
switch ($form) { case 'first': $companyName = test_input($parsedData["Company_Name"] ?? ''); if ($companyName === '') { $errors['Company_Name'] = "חסר שם חברה"; } elseif (!preg_match("/^[A-Za-zא-ת0-9 ]*$/u", $companyName)) { $errors['Company_Name'] = "שם החברה יכול להכיל אותיות ומספרים בלבד";לכן אמורה להתקבל שגיאה.
תודה רבה על העזרה
-
-
@dovid
זה כל הפלט, זה מה שכתבתי בפוסט הראשון, אני לא מצליח להבין את זה, כי השגיאה מתרחשת, ובוודאות נוצרת ע"י הסקריפט:// Return any validation errors for the first step without proceeding if(count($errors) > 0) { $parsedDataString = print_r($errors, true); file_put_contents('parsedData.txt', $parsedDataString); header('Content-Type: application/json'); echo json_encode(['errors' => $errors, 'db_errors' => $db_errors]); exit; }כפי שניתן לראות הכנסתי כתיבה של השגיאות לקובץ, בתוך הקובץ מופיעה השגיאה, להלן פלט הקובץ:
Array ( [Company_Name] => שם החברה יכול להכיל אותיות ומספרים בלבד )כלומר, ברור שיש שגיאה, אך אני לא מבין מדוע
success: function(data) { console.log('Server response: ', data); // Debugging lineבכלל לא פועל, עוד לפני
if (data.errors && Object.keys(data.errors).length > 0) { -
בקשר למה שאמר @צדיק-תמים תוכל לבדיקה להחליף את המילה success במילה complete ואז זה מופעל גם במקרה של error וגם בהצלחה.
-
@dovid @צדיק-תמים
תודה, השרת שלי מחזיר שגיאה, הוספתי את זה:$.ajax({ type: "POST", url: "validation.php", data: { 'form': currentTab, 'formData': formData }, success: function(data) { console.log('Server response: ', data); // Debugging line // Check if there are any errors if (data.errors && Object.keys(data.errors).length > 0) { // Log the errors for debugging console.error('Validation errors:', data.errors); // Display each error using the toast plugin for(var key in data.errors) { if(data.errors.hasOwnProperty(key)) { $.toast({ heading: 'Error', text: data.errors[key], // get the error message using the key hideAfter: 8000, // in milli seconds showHideTransition: 'slide', stack: 3, position: 'mid-center', icon: 'warning', bgColor: '#FFC800', loaderBg: '#FF9F00', // To change the background textColor: 'white', textAlign: 'left' }); } } } else if (data.success) { // If success is true, display success message and/or move to next tab console.log('Form submission successful'); // Your code to switch to the next tab or show a success message } }, error: function(jqXHR, textStatus, errorThrown) { // Handle server errors, network errors, etc console.error('AJAX error: ', textStatus, errorThrown); $.toast({ heading: 'Error', text: '.אירעה שגיאה בתהליך העיבוד של הטופס, בבקשה נסה שוב', hideAfter: 8000, showHideTransition: 'slide', stack: 3, position: 'mid-center', icon: 'error', bgColor: '#FF0000', loaderBg: '#FF9F00', textColor: 'white', textAlign: 'left' }); }, complete: function() { // Code to always run after the AJAX call finishes, regardless of success or error //console.log('AJAX request completed.'); // For example, re-enable the submit button if it was disabled } });השאלה למה..
