Challenges with CJuiDialog pop-up feature

As a beginner in AJAX, jQuery and similar technologies, I am currently working on a project that involves creating a calendar where substitutes can indicate their availability for specific days and time periods. However, I am facing an issue with implementing a pop-up window to allow substitutes to specify their available times when they click on a particular day.

Although I have come across several guides on Yii's forum on how to achieve this, I am encountering a problem where the pop-up window fails to open as intended. The code snippet below includes the link specified, but each link redirects to the calendar page instead of opening the pop-up window:

$url = CHtml::ajaxLink(Yii::t('job', 'Available'), Yii::app()->createUrl('offer/createOffer'), array(
            'onclick' => '$("#offerDialog").dialog("open"); return false;',
            'update' => '#offerDialog'
                ), array('id' => 'showOfferDialog'));
        /** You can query the database for an entry for this day if you like or print out a message on each day.  Uncomment these two lines.  * */
        $this->calendar.= '<div class="' . $this->style . '-normal">'. $url . '</div><br/>';
        $this->calendar.= str_repeat('<p> </p>', 2);
ajaxyiicalendarcjuidialog

Answer №1

The method CHtml::ajaxLink is defined with the signature: 

ajaxLink(string $text, mixed $url, array $ajaxOptions = array(), array $htmlOptions = array())

In this scenario, the event you are attempting to bind is an HtmlOption, not an Ajax option. Therefore, it should be specified accordingly.

When setting the onclick event to trigger your dialog, make sure to exclude the return false; statement, as it would hinder the execution of the ajaxCall.

Your code snippet should be structured like this:

$url = CHtml::ajaxLink(
            Yii::t('job', 'Available'),
            Yii::app()->createUrl('leads/admin'),
            array('update' => '#offerDialog'),
            array('id' => 'showOfferDialog', 'onclick' => '$("#offerDialog").dialog("open");')
        );
//Display Link
echo $url;

$this->beginWidget('zii.widgets.jui.CJuiDialog', array(
    'id'=>'offerDialog',
    // additional javascript options for the dialog plugin
    'options'=>array(
        'title'=>'Dialog box 1',
        'autoOpen'=>false,
    ),
));

echo 'dialog content here';

$this->endWidget('zii.widgets.jui.CJuiDialog');

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

When attempting to click a button, a chrome-error://chromewebdata/ error is being thrown by Cypress on cypress.io

Whenever I click a button that is supposed to redirect me to another page, Cypress suddenly stops and displays a cypress.io chrome-error://chromewebdata/ error message. The code snippet I have been utilizing is relatively straightforward: cy.get(' ...

ajaxcypress

Is it a poor practice to combine jQuery's $.each with an AJAX request?

Here is the code snippet that I am working with: $(document).ready(function() { var url = "https://graph.facebook.com/search?q=cinema&type=post"; $.ajax({ type: "POST", url: url, dataType: "jsonp", success: fun ...

jqueryajaxfacebook-graph-api

Invoke two functions simultaneously on a single Onchange event

Can someone help me understand how to trigger two functions by changing the value of a specific dropdown list using the "OnChange" event in Ajax? Note: The system typically only displays the output of the showhistory() function. Here is my existing code: ...

javascriptphpjqueryajax

Error encountered while using the jquery with Twitter Search API

Looking to initiate a twitter search using the jquery and the twitter api, I consulted the documentation before writing this code: $.getJSON("http://search.twitter.com/search.json?callback=myFunction&q=stackoverflow"); function myFunction(r) { co ...

jqueryajaxtwitterjsonp

Tips for interpreting JSON information and showcasing it with the assistance of Ajax in JQuery?

There's a request made to the system via AJAX that returns JSON as a response, which is then displayed in an HTML table. The HTML code for displaying the data looks like this: <table id="documentDisplay"> <thead> <tr ...

javascriptjqueryajaxjson

The Controller is encountering an empty child array when attempting to JSON.stringify it

After examining numerous similar questions, I am uncertain about what sets my configuration apart. I've experimented with various ajax data variations and JSON formatting methods, but the current approach seems to be the closest match. This issue is ...

javascriptjqueryjsonajaxasp.net-mvc

Utilizing JSON for sending model data to a controller in ASP.NET Core

I'm a beginner with ASP.NET Core and I'm attempting to send a view model to my controller. Data Model: public class ToolModel { public ToolModel() { } public string text { get; set; } public string type { get; set; } public stri ...

c#jsonajaxasp.net-core

How to easily upload multiple images with AJAX and jQuery in Laravel

I have an issue with uploading multiple images using Ajax and jQuery. When passing the images from the view to the controller in the request, I receive all the images in the form of an array. However, only a single image is being uploaded and only a single ...

jqueryajaxlaravel

What is the easiest way to clear browser cache automatically?

Hello, I have implemented an ajax auto complete function in one of my forms. However, I am facing an issue where over time, the suggestions get stored and the browser's suggestion list appears instead of the ajax auto complete list, making it difficul ...

phpjavascriptajax

Utilizing Struts 2 to Manage HTTP Array Parameters through Ajax Requests

Struggling with sending array parameters to a Struts 2 action class using struts 2.1.8.1. Check out this snippet of code: public class MyAction extends ActionSupport { private String[] types; public String execute() { return SUCCESS; ...

jqueryajaxstruts2type-conversion

When attempting to access the callback response with HTML tags from the server, the AJAX request in jQuery fails

I am currently facing a challenge while working on an ajax form submission that returns Json response. Everything functions smoothly except for a specific situation where I need to include HTML content in the response, such as a URL link for users to acces ...

jqueryhtmlajax

Once an AJAX call is made, the state of a React component changes but fails to trigger a

In this section, users have the opportunity to comment on posts. Once the data is received and verified on the server side, I attempt to update the value of this.state.comments. However, there is an issue where the comment section in the component does not ...

javascriptajaxreactjs

Managing the visibility of foreign or packaged object attributes with JsonView

Within my data object, there is a combination of primitives and data objects from external libraries that I am utilizing in my project. Although I can use the @JsonView annotation to control which data is returned to the browser during Ajax calls, this app ...

javaajaxjackson

Troubleshooting Issue with Internet Explorer failing to update Asp.Net MVC3 Partial View

I am experiencing an issue with a page that includes a div for a partial view loaded via an ajax request. $.ajax({ url: 'CompleteSessions', success: function (data) { var selector = $('#complete-session-sect ...

javascriptjqueryajaxasp.net-mvcinternet-explorer-11

Implementing Ajax functionality in MVC 3 to return a partial view

I wanted to express my gratitude for this invaluable site that has taught me so much. Currently, I am working on an MVC3 component where I need to populate a selectlist and upon user selection, load a partial view with the relevant data displayed. Everythi ...

javascriptjqueryajaxasp.net-mvcasp.net-mvc-3

PHP will send back a response code of 500, but only if it is submitted

Hey there! I've been working on implementing a two-step authentication system on a website, and I'm encountering an issue with an AJAX post. Every time I try to make the AJAX post, it returns a 500 Error. Oddly enough, when I directly run the co ...

phpjqueryajax

Is there a way to obtain an Instagram login token through AJAX?

I'm encountering issues while trying to receive a token from Instagram. Despite using the following code, I keep running into these errors: SEC7127: CORS request blocked the redirect. SCRIPT7002: XMLHttpRequest: Network Error 0x2ef1, Unable to final ...

javascriptjqueryajaxwampinstagram-api

Looping through AJAX requests in JavaScript

I am attempting to make REST API requests in order to retrieve data and display it on a website. Although I have created a for loop to gather the data, I am encountering an issue where the data is not being displayed on the website. Upon checking with th ...

javascriptjqueryajaxloops

Is it possible to implement the Jquery blockui(plugin) code without relying on Ajax?

Hey there, I'm new to Jquery and could really use some help... I've got a page with multiple links, but when a user clicks on one link and it's still processing in the background before loading the page, they keep clicking on other links wi ...

jqueryajaxstruts-1

Ajax Loading Bar similar to YouTube is not functioning as expected

I've implemented the YouTube-like Ajax Loading Bar to load a PHP file. Here is the JavaScript code I'm using: $(".ajax-call").loadingbar({ target: "#loadingbar-frame", replaceURL: false, direction: "right", async: true, complete: fun ...

phpjqueryajaxyoutubeloading