Adding Data to HTML Combo Box - mysql

I have two combo boxes in my JSP page named combo1 and combo2. I have a table in mysql called ZoneData. In this table there are two columns called zone and subzone. When the web page loads I want that when I select a zone name from combo1, all subzones of the selected zone should be extracted from ZoneData table and added in combo2. I am unable to do this. Should I use any combo1's event. Please help I am a newbie in web programming.

The usual way to do this type of things is to use javascript to manage combo1 onChange event.
I recommend you to use jQuery framework, as it eases a lot the basics of javascript client coding http://jquery.com
What you do when the event is fired is to capture it on a javascript function and make an AJAX call to your server, where you have some server method to filter the combo2 values that has to be loaded into your combo2 depending on the value of combo1. When this method returns, the AJAX call will receive the values from the method and will allow you to update data in combo2
This is a brief example of the jQuery code you'll need to manage the change event and make the AJAX call:
$("#combo1").change(function () {
$.ajax({
url: herePutTheUrlToYourServerMethod,
data: $("#combo1").val(),
success: function (returnedValueFromYourServerMethod) {
//Here use returnedValueFromYourServerMethod data to reload combo2 info
//There are several differents ways to do it that depends on what will
// your server method return
}
});
});

Related

To keep modified data on view on auto refresh of view data in angular 2

I am working on an angular 2 application. I came across the following scenario:
The data to be shown on view is coming from API. There are some fields which can be modified from view and then saved using API calls. There is functionality of auto refresh every 30 seconds(API call to update the view with latest data). Now suppose the user has modified the editable fields and before submitting for save, the page is auto refreshed and the changes made by the user is lost.
What I want, is to save the data changed by the user so that there is no need to modify it again after auto refresh.
Suggest some efficient way to implement it.
Just declare a variable in your component for flag that user something changed. Your code will look like this:
export class YourComponent implements DoCheck{
isUserChanged: boolean;
// ngDoCheck will fire every time when change detection of Angular will fire
ngDoCheck() {
this.isUserChanged = true;
// make isUserChanged to false when you need to do it.
}
}
when isUserChanged will be true then you will not update your view with data.
Hope it will help

All data is gone on page reload. Is there any way to avoid that?

I have developed one dashboard application in angular js which is having search functionality and multiple views with lots of different data coming from that search functionality.
Its single page application. So I am facing issue on page reload all data is gone and it shows view with blank data.
Is there any way to solve this issue or any language which help me to create single page application and maintain same data on page reload??
Any suggestion will be appreciated.
Search Page
Data after search
Data after reload
You can use sessionStorage to set & get the data.
Step 1 :
Create a factory service that will save and return the saved session data based on the key.
app.factory('storageService', ['$rootScope', function($rootScope) {
return {
get: function(key) {
return sessionStorage.getItem(key);
},
save: function(key, data) {
sessionStorage.setItem(key, data);
}
};
}]);
Step 2 :
Inject the storageService dependency in the controller to set and get the data from the session storage.
app.controller('myCtrl',['storageService',function(storageService) {
// Save session data to storageService on successfull response from $http service.
storageService.save('key', 'value');
// Get saved session data from storageService on page reload
var sessionData = storageService.get('key');
});
You need to save data before changing the state of application / moving to another page,route.
So, either save that data using
Angular services (Save data, change route, come back check the data in service and reassign variables from service.)
Local-storage to save data. (Save data, change route, come back check the data in service and reassign variables from service.)
Rootscope. Set data in rootscope and move .. after coming back check the variables and reassign.
Your problem is not saving the data, but saving the state in your URL. As it is, you only save the "step", but no other information, so when you reload the page (refresh, or close/re-open browser, or open bookmark, or share...) you don't have all the information needed to restore the full page.
Add the relevant bits to the URL (as you have a single page app, probably in the fragment identifier). Use that information to load the data, rather than relying on other mechanisms to pass data between the "pages".
Get data on page refresh, that is something like,
$rootScope.on('onStateChangeStart', function(){
// here make a call to the source
$http(); // request and try to get data
})
use localStorage or save data to your server for users in a database temporarily and get it back with an API call(localstorage has a 10MB) limit.
You can have your code try to retrieve localstorage values first if they exist.

Changing html on a view based on if get parameter is set on Codeigniter

Before I used Codeigniter I had a page show certain html as long as the url had no get parameters and then have some of the html be replaced by another as soon as something like this is set in the url:
localhost/signup.php?success
Now my question is, what is the best way to do this in Codeigniter? Would I have to use one of those parameters on the controller's function (which I still can't get my head around)? And if so, how? Or if I just had php logic in the view like I used to do in plain PHP, what would I check for if not a get parameter? Thanks.
Too many ways to achieve this certain thing.
routes.php
extending controller and using constructor so you apply rules for every extended controller
flashdata
Before you start please read up on frameworks watch some video tutorials on how to make simple blog system etc. I myself wouldn't just jump in to concept, study up.
I mentioned flashdata and that is how you do things done (success, alert, warning bars).
By default, GET parameters are not enabled or useful in codeigniter, but URI segments work the same way. So...
If you had a controller called, signup.php and a function inside it called success, you could link to that with:
localhost/signup/success
then if you loaded the URL helper, which I always do in config/autoload.php or just with:
$this->load->helper('url');
You could say:
if($this->uri->segment(2) == 'success') {
//Show success message or load a view for it...
}else {
//The second URI segment is NOT 'success' so do something else...
}
But... codeigniter is just a framework for PHP. If it's possible in PHP, it's possible in codeigniter. You can simply go into the config/config.php file and enable query strings, but I would strongly suggest using URI segments and reading up on them as well as the URL helper.

repetitive time call from a URL using JS

I have the code below that will grab an RSS feed and display it as a custom html feed shows these as scrolling text on a page.
" I would like to know how to make a timed call back to the RSS URL to display new information and drop out non current information. " Basically refresh the page on a timer..
function OnLoad() {
// Create a feed instance that will grab Digg's feed.
var feed = new google.feeds.Feed("http://131940.qld.gov.au/DMR.Modules/TTIEvents/RSS/RSS.aspx?regionid=0&eventcause=Incident");
feed.setNumEntries(15);
feed.includeHistoricalEntries();
// Calling load sends the request off. It requires a callback function.
feed.load(feedLoaded);
}
any help would be great.
Thanks in advance.
You need to use window.setInterval. Here's an example:
window.setInterval(OnLoad, 1000);
The first parameter is the name of your function, and the second parameter is the number of milliseconds that the browser should wait before calling that function again.
This example would call the function OnLoad once a second.

how to get value entered in UI created with the new HtmlService

I can get/access the value of the UI elements using,
e.parameter.elementname or app.getElementById(id)
if i create UI using UiApps or GUI builder like,
app.add(app.loadComponent("MyGui"));
app.getElementbyId('textbox1').setText("Hi");
If i use, HtmlService.createHtmlOutputFromFile('myPage');
How can i get the values entered in the html form - elements ?
As an alternative to client-side JavaScript, you can also create simple forms that submit to the doPost() handler which then processes the data. I created a sample script to demonstrate: Run, Source
When using HtmlService you need to rethink your app to be primarily client based not server based. You can (in client-side JavaScript) add a change handler to any element and do something with the value, including calling a server function with google.script.run.myFunction(someValue). See the new user guide here: https://developers.google.com/apps-script/html_service