نمایش نتایج 1 تا 17 از 17

نام تاپیک: مشکل در استفاده از ajax

  1. #1

    مشکل در استفاده از ajax

    سلام ، من از کد زیر برای ارسال درخواست ajax در یک فایل blade.php استفاده کردم:

    <body>
    <button type="button" onclick="loadDoc()">Request data</button>

    <span id="err">error</span>
    <head>

    <script>
    function loadDoc() {
    var response;
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    // document.getElementById("demo").innerHTML = this.responseText;

    console.log(response.success);

    }
    };
    xhttp.open("GET", "rout5", true);
    xhttp.send();

    }
    </script>
    </head>
    </body>



    کنترلر:

    public function AjaxController(){

    return response()->json(['success' => 'hello world']);
    }





    روت:
    Route::get('rout5',[AjaxController::class,'AjaxController']);




    موقع اجرا برنامه ، در تب network مقدار 200 رو دریافت می کنم ولی در تب console ، ارور response not definde رو دریافت می کنم ، مشکل از چیه ؟ چجوری باید response رو تعریف کنم که اونو بشناسه ؟ تشکر



  2. #2
    کاربر دائمی آواتار plague
    تاریخ عضویت
    آبان 1388
    محل زندگی
    اهواز
    پست
    2,360

    نقل قول: مشکل در استفاده از ajax

    از jquery استفاده کن بجای javascript خام خیلی ساده تره من از js [ام هیچوقت استفاده نکردم ولی با یه نگاه به نمونه های آنلاین
    پاسخ برگشتی توی this.responseText هستش و اگر جیسون برگشت میده سمت php باید سمت js دیکدش کنی اول



            var ajax_response = JSON.parse(this.responseText);
    console.log(ajax_response.success);

  3. #3

    نقل قول: مشکل در استفاده از ajax

    بسیار ممنون....مشکل ام حل شد.
    jquery بلد نیستم و البته داره منسوخ میشه و باید رفت سمت فریم ورک های جدید...

    برای این داستان هم هر چی سرچ کردم ، با jquery بود و متاسفانه ازش سردرنمیارم

  4. #4

    نقل قول: مشکل در استفاده از ajax

    نقل قول نوشته شده توسط plague مشاهده تاپیک
    از jquery استفاده کن بجای javascript خام خیلی ساده تره من از js [ام هیچوقت استفاده نکردم ولی با یه نگاه به نمونه های آنلاین
    پاسخ برگشتی توی this.responseText هستش و اگر جیسون برگشت میده سمت php باید سمت js دیکدش کنی اول



            var ajax_response = JSON.parse(this.responseText);
    console.log(ajax_response.success);

    اگر منبعی با استفاده از jquery سراغ دارید ، بذارید ممنون می شم

  5. #5
    کاربر دائمی آواتار plague
    تاریخ عضویت
    آبان 1388
    محل زندگی
    اهواز
    پست
    2,360

    نقل قول: مشکل در استفاده از ajax

    جی کوئری خیلی سادست و عمق زیادی نداره می ارزه یاد گرفتنش
    خیلی فریم ورک های دیگه از جی کوئری استفاده میکنن مثل بوت استرپ و انقد گستردست استفاده ازش که منسوخ نمیشه به این زودی ها
    فیلم های آموزشیش زیاد هست اگه زبانت خوب باشه

  6. #6

    نقل قول: مشکل در استفاده از ajax

    --------------

  7. #7

    نقل قول: مشکل در استفاده از ajax

    اکی مرسی ؛ ی سوال دیگه هم داشتم و اون اینکه اگر بخوام موقع ارسال درخواست ، کوئری استرینگ هم ارسال کنم ، چنین چیزی صحیح هست؟




    var id=1;
    xhttp.open("GET", "rout5/{id}", true);






    route:

    Route::get('/rout5/{id}',[AjaxController::class,'AjaxController']);



    همچنین ، برای گرفتن درخواست از سرور ، در کنترلر اینو نوشتم:


    return response()->json(['success' => 'hello world']);


    حالا اگر به صورت آرایه ارسال اش کنم:

    $test = array("1", "2", "3");
    return response()->json([$test]);



    در فایل blade ، چجوری باید دریافت اش کنم؟ چیو باید fetch کنم ؟ تشکر

    اینطوری؟


    let result=ajax_response.success;
    result.forEach(s =>console.log(s));
    آخرین ویرایش به وسیله volkswagen : سه شنبه 29 تیر 1400 در 21:37 عصر

  8. #8

    نقل قول: مشکل در استفاده از ajax

    البته فکر کنم برای ارسال درخواست بهمراه کوءری استرینگ ،باید از این روش استفاده کرد:


    var url="rout5/" + 1;
    xhttp.open("GET", url, true);

  9. #9

    نقل قول: مشکل در استفاده از ajax

    کدها مثال هست .در مثال زیر دو تا list box داریم که به ازای انتخاب آیتم از یکی از لیست ها ، درخواست به وسیله ajax ارسال میشه و میره از دیتابیس اطلاعات مورد نظر رو میاره و در list box دوم نمایش میده







    <body>

    <span id="err">error</span>
    <head>

    <script>
    function loadDoc() {
    var response;
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {

    var ajax_response = JSON.parse(this.responseText);
    var result=ajax_response.success
    //console.log(person.firstName) ;
    //console.log(result.subcategory_en) ;

    result.forEach(myFunction);
    function myFunction(item, index) {
    console.log(item. subcategory_fa ) ;
    var x = document.getElementById("mySelect");
    var option = document.createElement("option");
    option.text = item.subcategory_en + "|" + item. subcategory_fa;

    x.add(option);

    }

    };

    };

    var x = document.getElementById("category_test").selectedI ndex;

    var e = document.getElementById("category_test");
    var Selec_id = e.options[e.selectedIndex].value;

    //console.log(Selec_id);

    var url="rout5/" + Selec_id;
    //xhttp.responseType="json";

    xhttp.open("GET", url, true);
    xhttp.send();

    }
    </script>


    </head>
    </body>

    آخرین ویرایش به وسیله volkswagen : چهارشنبه 30 تیر 1400 در 06:01 صبح

  10. #10

    نقل قول: مشکل در استفاده از ajax

    در نهایت فکر کنم به این صورت باید اطلاعات رو fetch کرد(البته کدها رو برای مثال نوشتم و در نهایت باید ویرایش بشه تا کار کنه)


    var person = {
    firstName: "John",
    lastName: "Doe",
    age: 50,
    eyeColor: "blue"
    };


    var result=ajax_response.success
    result.forEach(myFunction);
    function myFunction(item, index) {
    console.log(item.firstName)


  11. #11
    کاربر دائمی آواتار plague
    تاریخ عضویت
    آبان 1388
    محل زندگی
    اهواز
    پست
    2,360

    نقل قول: مشکل در استفاده از ajax

    به راوت هات باید نام بدی و از نامشون توی سیستم استفاده کنی اینجوری بعدا اگه خواستی لینک رو تغییر بدی نیاز ینست قالب رو دست بزنی

     Route::get('/rout5',[AjaxController::class,'AjaxController'])->name('someroute');


    البته اگه پارامتر های ارسالیت رو با javascript بدست میاری و نمیتونی تو راوت php بزاری بهتره با کوئری استرینگ یا post ارسال کنی و جزوی از راوت نزاریشون

    جیکوئری سادست با

    $(selector) 


    المنت ها رو انتخاب میکنی که سلکتورش مثل css هستش مثلا اگه المنتی با آیدی category_test رو بخای میشه


    $('#category_test')


    بعد که انتخابش کردی میگی حالا چیکارش کن مثلا اگه value رو بخای

    $('#category_test').val();


    90% جی کوئری همینه ارسال ایجکس هم با جی کوئری به این شکله

       $.get( 'address' , { query_String_key : query_string_value}, function(result){

    // result -> pasokh bargashti

    });




    یعنی کلش میشه


     function loadDoc() 
    {
    var category_id = $('#category_test').val();
    $.get( '{{route('someroute')}}' , { category_id : category_id}, function(ajax_response){

    var ajax_response = JSON.parse(ajax_response);
    });
    }




    این خط ممکنه اررور بده

               var ajax_response = JSON.parse(ajax_response);    



    چون جیکوئری اگه درست درخواستت رو برگشت بدی خودش دیکد میکنه جیسون رو و نیازی نیست دیگه به این خط چون داری چیزی که قبلا دیکد شده اتومات رو دوباره دیکد میکنی

    در مورد آرایه هم جاواسکریپت 2 نوع آرایه داره که شکلشون فرق میکنه
    آرایه با کلید که بهش آبجکت میگن و به این شکله

     var data = { k : v , k : v  }


    آرایه بدون کلید که به این شکله


    var data = [ v , v, v ];


    برای خوندنشون باید بسته به اینکه کدوم مدل رو داری حلقه بزاری

    var  data = ['a' , 'b' , 'c'];
    data.forEach((element) => {
    console.log(element);
    });


    نوع با کلید

    var data = { name : 'ali' , last_name : 'alavi'};
    for (var [key, value] of Object.entries(data)) {
    console.log(key, '->' , value);
    }


    که نوع با کلید رومعمولا توی حلقه نمیزارن چون کلید داره و مستقیم بهش دسترسی پیدا میکنن


       var  data = { name : 'ali' , last_name : 'alavi'};

    console.log(data.name);
    console.log(data.last_name);



    باید دید کد php چجوری پاسخ رو برگشت میده مثلا اگه همچین چیزی داشته باشی توی کنترلرت برای گرفتن زیر دسته ها


    function get_subcategories(Request $request ){

    $categories = Category::where( 'parent_id' , $request->input('category_id) )->get();
    return response()->json(['success' => 1 , 'categories' =>$categories]);

    }



    توی ajax_response این رو خواهی داشت



    {
    success : 1 ,
    categories : [ { id : 1 , title : 'a' } , { id : 2 , title : 'b' } , { id : 3 , title : 'c' } ]
    }






    ترکیبی از آرایه با کلید و بدون کلید


    باید اینجوری هندلش کنی





    for (var  [key, value] of Object.entries(ajax_reponse.categories)) {
    console.log(value.id , value.title);
    }




    کلش میشه


    function loadDoc()
    {
    var category_id = $('#category_test').val();
    $.get( '{{route('someroute')}}' , { category_id : category_id}, function(ajax_response){

    var ajax_response = JSON.parse(ajax_response);

    if(ajax_response.success == 1 )
    {
    for (var [key, value] of Object.entries(ajax_reponse.categories)) {
    console.log(value.id , value.title);
    }
    }
    else
    {
    alert('something went wrong ! ');
    }


    });
    }

  12. #12

    نقل قول: مشکل در استفاده از ajax

    مرسی از توضیحات کامل...
    من در نهایت با خود جاوا اسکریپت نوشتم ولی ظاهرا با jquey خیلی راحت تره...دلیل اش هم اینه که میخوام در آینده از vue.js در کنار لاراول استفاده کنم تا با axios اینکارو بکنم ک البته فعلا حوصله اش نبود.

    این خط ممکنه ارور بده:

    var ajax_response = JSON.parse(ajax_response);

    بله اشتباهی نوشتم ، در کدهای برنامه ام ، اینطوری نوشتم:


    var ajax_response = JSON.parse(this.responseText);
    var result=ajax_response.success


    فقط من نفهمیدم که اگر قراره json رو به آرایه ای از object ها تبدیل کنیم ، چرا اینطوری نمی نویسیم؟


    var ajax_response = JSON.parse(this.responseText.success);


    و میایم اینطوری می نویسیم:


    var ajax_response = JSON.parse(this.responseText);






    کوءری استرینگ درست بود که نوشتم؟ چون برای من جواب میده


    var Selec_id = 1;
    var url="rout5/" + Selec_id;
    xhttp.open("GET", url, true);

    آخرین ویرایش به وسیله volkswagen : پنج شنبه 31 تیر 1400 در 00:13 صبح

  13. #13
    کاربر دائمی آواتار plague
    تاریخ عضویت
    آبان 1388
    محل زندگی
    اهواز
    پست
    2,360

    نقل قول: مشکل در استفاده از ajax

    جیسون یک استاندارد هست برای تبدیل ساختار های پیچیده مثل آرایه به رشته و برگشت اون رشته به آرایه
    آرایه در زبان های مختلف ساختار متفاوتی داره و شما نمیتونی یک آرایه php رو به js بدی چون آرایه در js شکل متفاوتی داره و قابل درک نیست براش آرایه php (دلیل های دیگری هم داره که بهش وارد نمیشم )

    ولی هردو رشته جیسون رو میفهمن پس وقتی بخای یک آرایه رو از php بدی به js اول جیسون کد میکنی تبدیل به رشته جیسون بعد رشته رو به js پاس میدی و اونجا دیکد میکنه برمیگردونه به آرایه

    مثل اینه که یه ایرانی بخاد با یک چینی صحبت کنه ... زبان همدیگه رو بلد نیستن ولی هردو انگلیسی بلدن
    پس چیزی که میخای بگی رو تبدیل میکنی به انگلیسی و به طرف میگی و اون طرف هم انگلیسی رو ترجمه میکنه به زبون خودش و متوجه میشه شما چی گفتی



    responseText پاسخ برگشتی از کنترلر هستش که یک رشته جیسونه و طبیعتا شما باید رشته جیسون رو دیکد کنی تا برگرده به آرایه
    responseText.success یه خونه هست توی آرایه responseText و تا وقتی responseText رو دیکد نکنی تا تبدیل بشه به آرایه اصلا نمیتونی بهش دسترسی داشته باشی
    و وقتی هم دیکد کنی responseText رو دیگه جیسونی در کار نیست و یه آرایه برات میمونه

    مثل اینه که شما یک جعبه داری که توش یه سری آیتم هستن مثلا لیوان یا سیب یا هرچی
    شما باید اول جعبه رو باز کنی تا به آیتم های توش دسترسی داشته باشی
    این حرف شما اینه که بخای بدون باز کردن جعبه یک آیتم درونش رو باز کنی ... اول اینکه تا وقتی جعبه رو باز نکردی به آیتم های توش دسترسی نداری دوم اینکه آیتم های درونش (مثلا لیوان) باز شدنی نیستن



    var url="rout5/" + Selec_id;



    این جواب میده ولی روش خوبی نیست
    بهتره از نام راوت استفاده کنی بجای آدرسش



    Route::get('/rout5',[AjaxController::class,'AjaxController'])->name('someroute');



    توی js


    var url="{{route('someroute')}}?id=" + Selec_id;


    که سیستم بره تو فایل راوت چک میکنه کدوم راوت این نام رو داره و میاد اینجا میزاره


    دلیلش اینه که اگه از آدرس راوت استفاده کنی و بعدا بخای آدرس رو عوض کنی مثلا بجای rout5 بخای بزاری rout6 اونقت باید بری توی قالب هات یا هرجای دیگری این راوت استفاده شده بری همه رو تغییر بدی

    ولی اگه از نامش استفاده کنی توی قالبت یا کد های js نیازی نیست چیزی رو تغییر بدی حتی اگه آدرسش عوض بشه چون شما نامش رو قید کردی و نه آدرس رو که بخای تغییری بدی ... یعنی کافیه توی فایل راوت آدرس رو تغییر بدی فقط

  14. #14

    نقل قول: مشکل در استفاده از ajax

    مرسی از توضیحات کامل و جامع

  15. #15

    نقل قول: مشکل در استفاده از ajax

    این جواب میده ولی روش خوبی نیست
    بهتره از نام راوت استفاده کنی بجای آدرسش



    1 Route::get('/rout5',[AjaxController::class,'AjaxController'])->name('someroute');





    توی js


    1 var url="{{route('someroute')}}?id=" + Selec_id;


    احتمالا نحوه تعریف کردن روت ، خطای املایی نداره ؟ چون وقتی از این روش استفاده می کنم ؛ بهم ارور میده:


    Missing required parameter for [Route: someroute] [URI: rout6/{id}] [Missing parameter: id]



    بعد از آدرس ، فکر کنم باید رشته ارسالی هم نوشته بشه ، یعنی اینطوری:

    Route::get('/rout5/{id}',[AjaxController::class,'AjaxController'])->name('someroute');


  16. #16
    کاربر دائمی آواتار plague
    تاریخ عضویت
    آبان 1388
    محل زندگی
    اهواز
    پست
    2,360

    نقل قول: مشکل در استفاده از ajax

    از اونجایی که نمیتونی از js متغیر به php پاس بدی (چون اول کد های php توی سرور احرا میشه و بعدا کد های js توی مرورگر اجرا میشه )
    نباید پارامتر رو توی لینک بزاری .... باید کوئری استرینگ پارامتر رو بزاری

    راوت رو بزار


    Route::get('/rout5',[AjaxController::class,'AjaxController'])->name('someroute');


    اینجوری آدرس بده بعدش


    var url="{{route('someroute')}}?id=" + Selec_id;



    اینجور یتابع رو توی کنترلر بنویس و دریاف کن

    function AjaxController(Request $request){

    $request->input('id'); // hamon $_GET['id'] mishe

    }


    اگه بخای توی لینک بزاری پارامتر رو باید لینک رو یجایی توی صفحه ذخیره کنی و از اون بخونی
    مثلا توی دکمه


    کد HTML:
    <a href="#" id="doc-btn" data-id="{{route('someroute' , ['id'=> 5 ])}}"  onclick="loadDoc()">  click me </a>
    و بعد اینجوری توی تابع بخونیش



    function loadDoc(){

    var btn = document.getElementById('doc-btn');
    var url = btn.getAttribute('data-id');

    }

  17. #17

    نقل قول: مشکل در استفاده از ajax

    مشکل حل شد ، ممنون

تاپیک های مشابه

  1. آموزش: راه اندازی و استفاده از CKEditor با استفاده از jQuery و AJAX
    نوشته شده توسط Vahid_moghaddam در بخش ASP.NET Web Forms
    پاسخ: 71
    آخرین پست: چهارشنبه 25 آذر 1394, 03:59 صبح
  2. پاسخ: 2
    آخرین پست: چهارشنبه 15 شهریور 1391, 15:21 عصر
  3. استفاده از فونت های مخصوص فارسی در صفحات وب با استفاده از ajax
    نوشته شده توسط Ehsan Rafsanjani در بخش ASP.NET Web Forms
    پاسخ: 3
    آخرین پست: شنبه 21 خرداد 1390, 21:31 عصر
  4. validation فرم با استفاده از ajax (بدون استفاده از xml و درست کردن request)
    نوشته شده توسط طاها حک در بخش JavaScript و Framework های مبتنی بر آن
    پاسخ: 5
    آخرین پست: دوشنبه 29 فروردین 1390, 01:19 صبح
  5. نحوه استفاده از ajax در پروژه ای که ajax enable نیست
    نوشته شده توسط mp2009 در بخش ASP.NET Web Forms
    پاسخ: 3
    آخرین پست: دوشنبه 16 مهر 1386, 10:04 صبح

قوانین ایجاد تاپیک در تالار

  • شما نمی توانید تاپیک جدید ایجاد کنید
  • شما نمی توانید به تاپیک ها پاسخ دهید
  • شما نمی توانید ضمیمه ارسال کنید
  • شما نمی توانید پاسخ هایتان را ویرایش کنید
  •