[2 days left] What’s wrong with your cloud strategy? Learn why multicloud solutions matter with Nimble Storage.Register Now

x
?
Solved

Read values from popup window using Java script

Posted on 2016-09-27
12
Medium Priority
?
99 Views
Last Modified: 2016-09-28
Hello Experts,

I have a form where I have a hyperlink to open one report where user can select the radio button from the report to use the owner.
Here is the screen shot:
Form popup

Now if i want to read the values using the JS script then how to do it ?
0
Comment
Question by:Swadhin Ray
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 6
12 Comments
 
LVL 16

Author Comment

by:Swadhin Ray
ID: 41819128
It would be great if any example can be used using the console option in chorme.
0
 
LVL 59

Expert Comment

by:Julian Hansen
ID: 41819538
Now if i want to read the values using the JS script then how to do it ?
What values are we talking about - can you elaborate - it is not clear what your question is.
0
 
LVL 16

Author Comment

by:Swadhin Ray
ID: 41819566
Say for example the ID column. First col in the report
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 59

Expert Comment

by:Julian Hansen
ID: 41819586
Please give me a use case I am not understanding the requirement here.

Where do you want the script that reads the values to run - for instance?

If I read your screenshots correctly then the report opens in a new window which makes its values inaccessible to script in the opening window.

Please can you describe exactly what you want to achieve so we don't have to guess.
0
 
LVL 16

Author Comment

by:Swadhin Ray
ID: 41819685
I have a read only field called action owner on the parent from , so when I read the value of the ID I should populate it by reading it from the report.
0
 
LVL 59

Expert Comment

by:Julian Hansen
ID: 41819706
Please can you confirm that target form and source report are in different browser windows.

If that is the case you cannot read the selected value from the report using code in the first window. You can add code to the report to push the value to the parent - but this implies you need to modify the report window code.
0
 
LVL 16

Author Comment

by:Swadhin Ray
ID: 41819710
Yes it is in different browser windows.
0
 
LVL 59

Expert Comment

by:Julian Hansen
ID: 41819729
Ok I am going to try one last time to get some information here then I am going to have to call it a day.

Do you have access to the report window code?
0
 
LVL 16

Author Comment

by:Swadhin Ray
ID: 41819732
Yes I do have the access to the report code.
0
 
LVL 59

Expert Comment

by:Julian Hansen
ID: 41819769
Can we see it.
0
 
LVL 16

Author Comment

by:Swadhin Ray
ID: 41819804
My parent form has two fields RISK_ASSESSMENT_ID .

I have my form and report as below:

Report and form

Here is the code for my report template :

<html>
<head>
<title>@title@</title>
<meta http-equiv="Expires" content="0">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="Content-Type" content="text/html; charset=@CHARACTER_SET@">
<LINK REL="stylesheet" TYPE="text/css" HREF="@WEBROOT@/gui_styles.css"/>
<LINK REL="stylesheet" TYPE="text/css" HREF="@WEBROOT@/commonui_new.css"/>

 
@%'report/include/reports_include_style_section.htmp'@

</head>
@reqNotFromZaplet(
<body @ENABLE_JS(onload="javascript:onLoadBehaviors()")@ bgcolor="#ffffff" text="#000000" link="#000099" vlink="#000099" alink="#000099" >
)@
@reqFromZaplet(
<body bgcolor="#ffffff" text="#000000" link="#000099" vlink="#000099" alink="#000099">
)@
<SCRIPT src="@WEBROOT@/calenderfunctions.js" language="Javascript">
</SCRIPT>
<SCRIPT src="@WEBROOT@/generic.js" language="Javascript">
</SCRIPT>
<SCRIPT src="@WEBROOT@/reportFunctions.js" language="Javascript">
</SCRIPT>
<SCRIPT src="@WEBROOT@/ext/GridSummary.js" language="Javascript">
</SCRIPT>


<script language = "javascript" >
		
var contextParams= {};

</script>

<script language = "javascript" >
var recPerPage ;


Ext.onReady(function(){
	
	Ext.QuickTips.init();
    
    

var ppop = null;
var report_id = '@REPORT_ID@';


var parReqDisplay = '@PARAMETERS_FOR_REQ_DISP@';
var parReq = '@.PARAMETERS_FOR_REQ@';
var rtSortColSeq='@RUNTIME_SORT_COL_SEQ@';
var rtSortDir='@RUNTIME_SORT_DIR@';
var srchCond='@SEARCH_COND@';
var numRows='@NUM_ROWS@';
var baseparams = {
"REPORT_ID":"@REPORT_ID@",
"METRIC_ID":"@METRIC_ID@",
"INSTANCE_ID":"@INSTANCE_ID@",
"INSTANCE_ID_2":"@INSTANCE_ID_2@",
"REP_MODE":"@REP_MODE@",
'ENTERPRISE_ID':'@ENTERPRISE_ID@',
"REPORT_NAME":"@REPORT_NAME@"
};

var baseparams2 = {
'PARAMETERS_FOR_REQ':'@.PARAMETERS_FOR_REQ@',
'RUNTIME_SORT_COL_SEQ':'@RUNTIME_SORT_COL_SEQ@',
'SEARCH_COND': '@SEARCH_COND@',
'RUNTIME_SORT_DIR':'@RUNTIME_SORT_DIR@'
};

var toolparams = Ext.apply({}, baseparams);

var filterparams = Ext.apply({},baseparams);

Ext.apply(filterparams, {
"metricid":"@metricid@",
"STARTING_INSTANCE_ID":"@STARTING_INSTANCE_ID@",
"OFFSET_INSTANCE_ID":"@OFFSET_INSTANCE_ID@",
"REP_ACTION":"@REP_ACTION@",
"RELATED_MODE":"@RELATED_MODE@",
"DISPLAY_SET_NUM":"@DISPLAY_SET_NUME@",
"NAME_OF_SUBMIT_TARGET":"@NAME_OF_SUBMIT_TARGET@",
"CORRECTIVE_ACTION_ID":"@CORRECTIVE_ACTION_ID@",
"ACTION_TYPE_ID":"@ACTION_TYPE_ID@",
"REPORT_TYPE":"@REPORT_TYPE@",
"OUTPUT_WINDOW":"@OUTPUT_WINDOW@",
"wrapper":"@wrapper@",
"PARAMS_CODE":"@PARAMS_CODE@",
"CURRENT_FORM":"@CURRENT_FORM@",
"METRIC_ID_REF":"@METRIC_ID_REF@",
"INSTANCE_ID_REF":"@INSTANCE_ID_REF@",
"HISTORY_DATE1":"@HISTORY_DATE1@",
"HISTORY_DATE2":"@HISTORY_DATE2@",
"HISTORY_DATE_ERR":"@HISTORY_DATE_ERR@",
"ERR_MSG":"@ERR_MSG@",
"templ":"@templatename@",
"REPORT_LAYOUT":"@REPORT_LAYOUT@",
"errorHidden":"@ERR_MSG@",
"output":"@output@",
"copyright_needed":"@copyright_needed@",submit_x:16});

	recPerPage = @RECORDS_PER_PAGE@;
	var flag=0;

@CONTEXT_SENSITIVE_FUNC(
    contextParams= Ext.apply({}, baseparams);

    Ext.apply(contextParams, {
        'PARAMETERS_FOR_REQ':'@.PARAMETERS_FOR_REQ@',
        'SELSTR':'@SELSTR@',
        'METRIC_VIEW':'@METRIC_VIEW@',
        'wrapper':'@wrapper@',
        'OUTPUT_WINDOW':'@OUTPUT_WINDOW@',
        'output':'@output@',
        'copyright_needed':'@copyright_needed@'
    });
)@



@%'report/include/reports_include_common_grid.xhtmp'@    

@%'report/include/reports_include_filter_section_grid.xhtmp'@



    function summaryrenderer(v, params, data) {
           if(store.reader.summaryData)
            var summary = store.reader.summaryData[params.id];
            if(summary) {
                v= summary.desc + ' ' + summary.value;
            }
            return v? v  : '';
    }

    function colRenderer(val, meta, record, rowIndex, colIndex, store) {
	try
    {
        var x =all_data[rowIndex].length;
    }
    catch(e)
    { 
       all_data[rowIndex]=new Array();
    }
	all_data[rowIndex][colIndex]= val;
	    val = val || '';
        var rv = val.split('_$$');
        if(rv.length >1) {
            val = rv[1];
            if(meta) {
                meta.attr= 'style="'+ rv[0]+ '"';
            }
        }
       
        try {
        
        }catch(e) {}
      
        

        return val;

    }

        var gridColumnModel = new Ext.grid.ColumnModel([
@HEADER_INFO(@HEADER_ROW[0](@HROW({header: '@USER_NAME@',sortable:@SORT_LINK{@""(false)@@(true)@}@, renderer:colRenderer,summaryRenderer: summaryrenderer, dataIndex:'@DATA_COL_SEQ@',width:@COL_WIDTH@,align:'@ALIGN_HDG@'}
)@)@@HEADER_ROW[1..](@HROW(,{header: '@USER_NAME@',sortable:@SORT_LINK{@""(false)@@(true)@}@, renderer:colRenderer, summaryRenderer: summaryrenderer, dataIndex:'@DATA_COL_SEQ@',width:@COL_WIDTH@,align:'@ALIGN_HDG@'})@
)@
)@ ]);


       
    var recordModel= [
    @HEADER_INFO(@HEADER_ROW[0](@HROW({name:'@DATA_COL_SEQ@',mapping:'col@DATA_COL_SEQ@'})@)@
    @HEADER_ROW[1..](@HROW(,{name:'@DATA_COL_SEQ@',mapping:'col@DATA_COL_SEQ@'})@)@
    )@ ];

	
	var report_name = decodeHtmlContent("@#REPORT_NAME@");	
	if(report_name == '@rptCoreObjectsForScope1@' || report_name == '@rptCoreObjectsForScope5@')
		report_name = '@rptAuditableEntities@';
	else if(report_name == '@rptOrgsForAE@')
		report_name = '@rptOrganizations@';
	else if(report_name == '@rptRisksForAE@' || report_name == '@rptRisksForOrg@')
		report_name = '@rptRisks@';
	else if(report_name == '@rptAEsForOrg@')
		report_name = '@rptAuditableEntities@';
	else
		report_name = decodeHtmlContent("@#REPORT_NAME@");
	
	
       var store = new Ext.data.Store({
            reader: new Ext.data.CFQueryReader({
                id: 'NAME', 
                fields:recordModel
            }),
            fields: recordModel,
            remoteSort: true,
            url:'Reportsstart/ajax/ReportStart?REPORT_ID=@REPORT_ID@&templ=Tabularjson.xhtmp'
            ,id:'dataStoreId'
        });

        store.on('beforeload', function(store, options) {
            options.params || (options.params = {}); 
            var start=options.params.start ;
            var limit= options.params.limit;

            var pageu = 'all';
            if (limit != -1) {
                pageu = Math.floor(start/limit)+1;
                Ext.apply(options.params, {
                    RECORDS_PER_PAGE : limit
                });

            }
            Ext.apply(options.params, {

                pageu:pageu
            });

            if(store.sortInfo) {
                rtSortDir = store.sortInfo.direction;
                rtSortColSeq = store.sortInfo.field;
            }
            if (!options.params.submit_x) {
                Ext.apply(options.params, baseparams);

                Ext.apply(options.params, {
                    'PARAMETERS_FOR_REQ':parReq,
                    'RUNTIME_SORT_COL_SEQ':rtSortColSeq,
                    'SEARCH_COND': srchCond,
                    'RUNTIME_SORT_DIR':rtSortDir
                });
            }

          
        });
        store.on('load', function(store, recs, options) {
			parReqDisplay = store.reader.paramsForReqDisp;
            parReq= store.reader.paramsForReq;
            showError(store.reader.errmsg);
            baseparams.INSTANCE_ID = store.reader.currentInstanceId; 
            numRows = store.reader.totalRowCount;
            contextParams.INSTANCE_ID = store.reader.currentInstanceId;
            document.contextform.INSTANCE_ID.value = store.reader.currentInstanceId;
            document.contextform.PARAMETERS_FOR_REQ.value = store.reader.paramsForReq;

            if(options.params.pageu=='all') {
                bbar.pageSize=store.reader.totalRowCount;
            }

            if(options.params.submit_x) {
                store.lastOptions.params = {};
            }
			checkSelectedEntitiesforRadio();

        });
       
 

var combo = new Ext.form.ComboBox({
  name : 'perpage',
  width: 60,
  store: new Ext.data.SimpleStore({
    fields: ['id'],
    data  : [
      ['20'],
      ['40'],
      ['80'],
      ['All']
    ]
  }),
  mode : 'local',
  value: recPerPage,

  listWidth     : 40,
  triggerAction : 'all',
  displayField  : 'id',
  valueField    : 'id',
  editable      : false,
  forceSelection: true
});

var bbar= new Ext.PagingToolbar({
            store: store,
            pageSize : recPerPage,
            displayInfo: true,
            items   :    [
                    '-'
                    @output{@"infoport"()@@(
                    ,'@label.recordsperpage@: '
                    ,combo
                    )@}@
            ],
            displayMsg:'@label.dispayingrecords@ '+'{0} - {1} '+'@label.of@ '+'{2}', 
            emptyMsg:'@label.norecordstodisplay@' 
        });

    combo.on('select', function(combo, record) {
        if('All' == record.get('id')) {
            bbar.pageSize =-1;
        } else {
            bbar.pageSize = parseInt(record.get('id'), 10);
        }
            recPerPage = bbar.pageSize;
        bbar.doLoad(0);

    }, this);


    var summary = new Ext.ux.grid.GridSummary();
    var mainPanel = {
    	xtype: 'panel',
        id: 'main-panel',
		layout: 'border',
		region: 'center',
		tbar:[
		    {
				xtype: 'tbtext',
				text: 'Search :'
			}
			,
			{				
				xtype: 'textfield',
				name: 'searchField',
				id:'searchField',
				width: 200,
				grow:true,
				growMin:200,
				emptyText:'search here',
				listeners: {
					'render': function(c) {
					  Ext.QuickTips.register({
						target: c.getEl(),
						text: 'Filters data from current page'
					  });
					  c.getEl().on('keyup', function() {
						var searchValue=Ext.getCmp('searchField').getValue();
						var count=0;
						store.filterBy(function myfilter(record) {
						var colValue1=record.get('2') ;
						var colValue2=record.get('3') ;
						
						searchValue=searchValue.toUpperCase();
						colValue1=colValue1.toUpperCase();
						colValue2=colValue2.toUpperCase();
						
					    if(colValue1.indexOf(searchValue) ==-1 &&
						colValue2.indexOf(searchValue) ==-1){
							return false;
						}else{
							count=count+1;
							return true;
						}
					});

					try{
						document.getElementById(FieldValue1).checked=true;
					}
					catch(e){}
					  }, c);
					}
				  }
			}
        ],
        items :[
       /*      paramForm1
            @HEADER_INFO{@""(
            ,{
                xtype: 'panel',
                region: 'center'
            }
            )@@( */
                {
                xtype: 'grid',
                @output{@"infoport"()@@(
                   /*title : '@label.report_data_as_of@ @TIMESTAMP_1@ @TIMESTAMP_VS@ @TIMESTAMP_2@',*/
                )@}@
                region: 'center',
                layout: 'fit',
                id:'grid',
                repid:'@REPORT_NAME@',
                viewConfig: {
                    forceFit:true,
                    emptyText: '@label.norecordstodisplay@'
                },    
                colModel:getModifiedCM(),
                store: store,
                @DISPLAY_SETS(@REPORT_FOOTER(
                plugins: [summary],
                )@)@
                stripeRows: true,
				bbar:bbar,
/*                 bbar: [{
					xtype: 'tbtext',
					text: '@label.norecordstodisplay@'
				}
				], */
                tools:[{
                   id:'gear',
                   handler: function(event, toolEl, panel){
                        repToolsMenu.show(toolEl, 'tr-bl'); 
                   }
                }],
                listeners: {
                    'render': function(){
                        var initParams = Ext.apply({}, {start:0, limit:recPerPage});                                                
                        this.store.load({params:initParams});
                    },
					'viewready' : function(){
				}
                }
				
            }
            )@
            }@

        ]
    };
	
	
	
	function getModifiedCM(){
			for(var i=0;i<gridColumnModel.config.length;i++){
				if(gridColumnModel.config[i].header=='OBJECT_ID' || gridColumnModel.config[i].header=='METRIC_URL'
				    || gridColumnModel.config[i].header=='Parameter_PDF_YN' || gridColumnModel.config[i].header=='Pdf Id'
					|| gridColumnModel.config[i].header=='Parameter_PDF_YN_In_Progress'){
					gridColumnModel.config[i].hidden=true;
					}
			}
			return gridColumnModel;
		}

    var filterTip= ['@label.show_filters@', '@label.hide_filters@'];

    var errormsg = "@ERR_MSG@";
    var errorbar = {
                id: 'errmsg',
                xtype: 'tbfilltext',
                style:' background-color: #ffffff; border: 1px solid #ee0000; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #ee0000; padding: 5px 0 5px 0; margin-bottom: 5px; width: 100%; text-align: center; ',
                hidden:true,
                autoEl: {
                    html: errormsg
                }
            };
        if(errormsg) {
           errorbar.hidden = false;
        }
		
    var topbar = new Ext.Toolbar({
        region : 'north',
        height:30,
        margins: '0 0 0 5',
        items:[
            {
            xtype: 'box',
            id: 'title',
            autoEl: {
            html: report_name
            }
            },
            {xtype: 'tbfillspacer'},
            errorbar,
            '->',
            {xtype: 'tbfillspacer'},
 /*            {
                text: '@title.popup_filters@',
                id: 'toggleFilter',
                tooltip: filterTip[0],
                enableToggle: true,
                hidden: !hasParams,
                toggleHandler: onItemToggle
            }, */
			{
                text: 'Select None',
                id: 'clearAllBtn',
                tooltip: 'Select None',
                handler: clearAllEntities
            },		
            {
                text: '@label.done@',
                id: 'doneBtn',
                tooltip: '@label.done@',
                handler: SelectToParent
            },
            {
                text: '@label.cancel@',
                id: 'CancelBtn',
                tooltip: '@label.cancel@',
                handler: doCancel
            }		
        ]
        
    });

    var viewPort = new Ext.Viewport({
		layout: 'border',
		title: 'Ext Layout Browser',
        defaults:{
            @output{@"infoport"()@@(
                margins: '5 0 0 5'
            )@}@
        },
		items: [
            @output{@"infoport"()@@(
            topbar,
            )@}@
			mainPanel
		],
        renderTo:Ext.getBody()
    });
    viewPort.doLayout();
});


</SCRIPT>
<script language = "javascript" >
var FieldValue;
var FieldValue1;
//var selectedValues=new Array();

function onLoadBehaviors() {
	try{
		FieldValue=parent.window.opener.getSelectedValue();
		FieldValue1=parent.window.opener.getSelectedValuesSec();
	}
	catch(e){		}
    //@OUTPUT_WINDOW{@NEW_WINDOW(
        setWindowSize();
    //)@}@
}
try{
window.onunload = parent.window.opener.callClose;

}
catch(e){}

function setWindowSize() {

		var width=600;
		var height=600;
        window.resizeTo(width,height);
		var left = parseInt((screen.availWidth/2) - (width/2));
		var top = parseInt((screen.availHeight/2) - (height/2));
        window.moveTo(left,top); 

}
var selectedrows='';
var selectDispRows= '';
function checkboxChange(seqno)
{
  var cbox=document.getElementById(seqno);
  if(cbox.checked)
  {
	if(selectedrows != '')
	{
		selectedrows = selectedrows + ','+cbox.name;
		selectDispRows =selectDispRows + ','+cbox.value;
    }
	else
	{
		selectedrows = cbox.name;
		selectDispRows = cbox.value;
	}
}

}
function checkSelectedEntitiesforRadio()
{

				try{
					var elem=document.getElementById(FieldValue1);
					elem.checked=true;
					populateValues(FieldValue1);
				}
				catch(e){
				
				}

}

function uniquesselectedrows(selectedrow1,deselectedvalue){
	var selrowsarr = selectedrow1.split(",");
	var selrowsnew = [];
	var oldrows ={};
	
	for(var i=0;i<selrowsarr.length;i++) {
		if (selrowsarr[i] != deselectedvalue) {
			oldrows[selrowsarr[i]]=true;
			selrowsnew.push(selrowsarr[i]);
		}
	}
	return selrowsnew.join(",");
	
}
function SelectToParent()
{
	try
	{
		if(typeof(selValArr[1])=='undefined' && typeof(selValArr[2])=='undefined') // fix for bug 216639
		{
			selValArr[1]='';
			selValArr[2]='';
		}
		var selectDispRows=	selValArr[1];
		var selectedrows = selValArr[2];
		// changes done by deeksha for bug 214226
		/*if(flag==0)
	    {selectedrows='';
		 selectDispRows='';}*/
		parent.window.opener.callParent_LevelApproverSec(selectedrows,selectDispRows);
		parent.window.opener.focus();
		parent.window.close();
	} 
	catch(e){
		window.close();
	}
}

function clearAllEntities()
{
	// changes done by deeksha for bug 214226
	for(var i=0; i<all_data.length; i++) {	
		var chkid = selValArr[2];	
		try{
			document.getElementById(chkid).checked=false;
			flag=0;
			populateValues(FieldValue1);
			selValArr[1]='';
			selValArr[2]='';
		}
		catch(e){}
	}
}

var all_data=new Array();
var all_data_idx=0;
function doCancel()
{

	window.close();

}

var all_data_index;
var selValArr = new Array();
var i=0;
function populateValues(radioID)
{
	FieldValue1=radioID;
	selValArr = new Array();
	flag=1;
	for(var i=0; i<all_data.length; i++)
	{
		if(all_data[i][2] == radioID)
		{
			selValArr = all_data[i];
		}
	}
}

function fnFilter(){
	alert(1);
}

</SCRIPT>
@%'report/include/reports_include_contextform_grid.xhtmp'@
</body>
</html>

Open in new window

0
 
LVL 59

Accepted Solution

by:
Julian Hansen earned 2000 total points
ID: 41819861
what you need to do is catch the click event on the radio in the report.
Get the id of that radio
Call a function in the parent with that value
The function in the parent then adds that value to the form.
In the report
var radios = document.forms['report'].elements["ownerid"];

for(var i = 0, max = radios.length; i < max; i++) {
  radios[i].onclick = function() {
    window.opener.myFunction(this.value);
  }
}

Open in new window

In the parent
window.myFunction = function(id) {
  document.getElementById('fred').value = id;
}

Open in new window

In the parent
window.yourFunction = function(id) {
  // do something with id here
}

Open in new window

Working sample here
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
A while back, I ran into a situation where I was trying to use the calculated columns feature in SharePoint 2013 to do some simple math using values in two lists. Between certain data types not being accessible, and also with trying to make a one to…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

656 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question