What is the best way to transfer data between windows using titanium (classic)?

'The code I've written utilizes MyHTTPlink to retrieve information such as Restaurant Name, url, and address. Currently, it lists all restaurant names and urls in a table. Now, I want to figure out how to send the details of a table row to the next window (.js page). Each restaurant's URL contains a list of menu items which I would like to display in a table row on the next page. How should I approach coding this?'.

var win = Titanium.UI.createWindow ({  backgorundColor: '#000'}); 

var tableview = Ti.UI.createTableView({ 
 height:'auto', 
 layout:'vertical', 
 top:5, 
 right:5, 
 bottom:5, left:5 });

var data = [];

var xhr = Ti.Network.createHTTPClient ({
onload: function () {

    alert("success!");
    var json = JSON.parse(this.responseText);
    for (var i = 0; i < json.connectionResponses.length; i++) {


        var row = Ti.UI.createTableViewRow({
            height: 60,
        });

        var restLabel = Ti.UI.createLabel({
            text: json.connectionResponses[i].restaurantName, 
            height: 'auto',
            left:54,
            top: 5,
            font:{ fontSize:20 } 
        });
        var connLabel = Ti.UI.createLabel({
            text: json.connectionResponses[i].connectingurl, 
            height: 'auto',
            left:54,
            bottom:5,
            font:{ fontSize:14 } 

        });
        var image = Titanium.UI.createImageView({ 
            image:'images/menu_icon.png',  
            top:4, 
            left:0, 
            height:45, 
            width:41 
        });

        row.add(restLabel);
        row.add(connLabel);
        row.add(image);
        data.push(row);
    }

    tableview.setData(data);

   },
   onerror: function () {
        alert('There was an error retrieving the remote data. Try again.');
   }
   //timeout:5000
   });

xhr.open("GET", "http:MYHTTPlink"); 
xhr.send();

tableview.addEventListener('click',function(e){
     //alert("RS Name : " +e.row.title);
     var winn = Ti.UI.createWindow({ url:'hotelpage.js'});
     winn.open();
    //var hostelwin = require('hotelpage').gethotelWin;
    //var newwin = new hotelwin();
    //newwin.open();
  });

   win.add(tableview);

   win.open();

Answer №1

Feel free to refer to the code snippet below and incorporate it into your project for optimal functionality:

tableview.addEventListener('click',function(e){
         //alert("RS Name : " +e.row.title);
         var winn = Ti.UI.createWindow({ 
             url:'hotelpage.js',
             row_title : e.row.title,
             all_info: e.row,
         });
         winn.open();
        //var hostelwin = require('hotelpage').gethotelWin;
        //var newwin = new hotelwin();
        //newwin.open();
      });

Additionally, make sure to include the following in your "hotelpage.js" file:

var curtWind = Ti.UI.currentWindow;
// Retrieve necessary data using the following method
var title = curtWind.row_title;
var allData = curtWind.all_info;
// Customize as needed based on your project requirements.

This should provide some valuable insights for your project needs.

Best regards,

Answer №2

Aside from the response provided by MRT which is accurate and functional, you have the option to utilize this code that eliminates the need for the url property according to recommendations found in the Titanium 3.X documentation.

Your code snippet:

tableview.addEventListener('click',function(e){
    hotelWin = require('/yourpath/hotelpage');
    var hotelW = new hotelWin(e.row.title, e.row.id)
  });

Content of hotelpage.js file:

function external(title, id) {
    var hotelPageWin = Titanium.UI.createWindow({
    //properties go here
    });

    //Within this function, you can access two variables: 
    //title has been assigned the value of e.row.title
    //id has been assigned the value of e.row.id

    hotelPageWin.open();

    return hotelPageWin;
};

module.exports = external;

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

Implementing a Vue.js v-bind:style attribute onto a dynamically generated element post-page initialization

Let me start by explaining my current issue and dilemma: I have been tasked with converting an existing JS project into a Vue.js framework. While I could easily solve a particular problem using jQuery, it seems to be posing quite a challenge when it comes ...

JQuery grid pagination bar mysteriously missing

I'm having an issue with a Jquery grid that is built on an HTML table. I've properly configured the grid properties, including implementing pager functionality with a page size of 10. However, I am unable to see the page up and page down buttons ...

After subscribing, my Angular template fails to refresh

Currently, I am facing an issue with my Angular 17 project where the data fetched from the API is not updating the template. This means that despite receiving the data, I am unable to display it on the page. The code snippet below shows the service compon ...

SEO Optimized pagination for pages without modifying the URL

On my website, I utilize pagination to navigate to various event pages. However, search engines are not picking up the conferences on these pages. Take a look at the code snippet below... <a href="javascript:;" class="first" title="First" onclick="getC ...

Combining a 3D array into a 2D array with the addition of HTML tags around each value using JavaScript

3D array // Array var x = { "letter": [ "a", "b", "c", "d", "e", "f", "g", "h", "i" ], "line": [ { "data": [ 306, 830, 377, 651, 547, 369, 300, 148, 494 ] }, { "data": [ 88, 339, 298, 87, 96, 108, 93, 182, 64 ] }, { "data": [ 3157, 2943, ...

Changing Marker Colors in OpenLayers After Importing GPX Data: A Quick Guide

Check out this link for a code tutorial on importing GPX files and displaying map markers. I successfully implemented this code to show map markers. Is there a way to customize the color of the markers? Edit: var fill = new Fill({ color: 'rgba(2 ...

"Implementing classes with AngularJS: A Step-by-Step Guide

Is there a way to dynamically add a class to the i tag after a button is clicked in AngularJS? <button type="button" title="Like" ng-click="countLikes(product.title)" class="btn btn-compare"> <i class="fa fa-thumbs-o-up"></i> </ ...

Customizing the default settings of a d3 funnel chart

I recently used the following link to create a funnel chart using D3: jakezatecky/d3-funnel Everything was working perfectly. However, I wanted to adjust the block heights in proportion to their weight as mentioned in the tutorial by changing the D3 defau ...

Passing onClick event to parent component during iteration in ReactJS

I am facing a challenge where I need to remove a row from a table upon a click event. I have managed to create an iteration and display a delete button, but I am struggling with passing the onClick event from the parent component to the child component in ...

Learn the process of dynamically populating an HTML table with data using JavaScript and JSON

I have developed a code snippet to dynamically add an HTML table without using jQuery. The code serves as an application from the server to the client, where the client receives a JSON object to parse into a string. Here is how you can add an HTML table ...

How can you use jQuery to transform a H3 tag into a clickable link?

To transform the h3 tag into a clickable link with jQuery and set the href attribute, while preserving the H3 styling and adding an anchor tag, you can use the following code as an example: Click Here ...

Numerous JQuery AJAX form submissions leading to individual outcomes

I have implemented a script on my page that handles form submissions for multiple forms by calling a specific action. Here is the script: $(function () { $('form').submit(function () { if ($(this).valid()) { $.ajax({ ...

Verify if there are multiple elements sharing the same class and initiate a certain action

I am working with three products that have a similar structure: tickbox | label (same text but different value) | Qty dropdown (different input name) These products fall into three different label "classes": 1st - <label for="related-checkbox-708745 ...

Transmit an audio buffer to the client for direct download without the need for server storage

As part of my project, I am developing a text-to-speech feature utilizing the technology of IBM Watson API. With the assistance of the code snippet below, I have successfully managed to acquire the .wav file after conversion onto my server. textToSpeech ...

Should I increase the number of followers, or opt for an aggregated method to monitor them?

My system loads products using an infinite scroll, displaying 12 at a time. Sometimes, I may want to sort these products based on the number of followers they have. Here's how I keep track of the followers for each product: The follows are stored i ...

Once the AJAX callback is complete, the onblur event will revert back to the original field or the updated field

I am currently working with an AJAX callback: Here is the HTML snippet: <a onCLick="loadXMLDoc(id1,id2)">(Add)</a> This function triggers an AJAX method that replaces the "(Add)" text with a basic HTML input field. Subsequently, when there ...

Leveraging the back button in an AngularJS Mobile SPA

Utilizing AngularJS for my Single Page App (SPA), I am currently exploring the most effective way to handle the back button functionality on mobile devices. My setup involves a single JavaScript file, one HTML page, and no partials. The content is reveale ...

The JavaScript code is not being executed, as the address bar displays the function name instead

In my project, I have created numerous "js-classes" with various functions spread across different files. Unfortunately, the codebase is too large to share entirely. However, towards the end of the project, I encountered a bug where a specific function wa ...

Use JavaScript to swap out images

How can I change the image arrow when it is clicked? Currently, I have this code snippet: http://codepen.io/anon/pen/qEMLxq. However, when the image is clicked, it changes but does not hide. <a id="Boton1" class="button" onClick="showHide()" href="j ...

What is the best way to show a macOS progress pie loading icon alongside files?

While using macOS, a pie loading icon appears next to a file during downloading or transferring. To illustrate, here is an example of a file being downloaded from Chrome: I am interested in implementing a similar feature in my Electron/Node application. ...