Know what radio is checked in RadioGroup (ext.net) - c#

I dinamically add one RadioGroup into a panel (see code below)
ctrl = new Ext.Net.RadioGroup();
ctrl.ID = idPregunta.ToString();
ctrl.EnableViewState = true;
((Ext.Net.RadioGroup)ctrl).GroupName = idPregunta.ToString();
((Ext.Net.RadioGroup)ctrl).FieldLabel = pregunta;
((Ext.Net.RadioGroup)ctrl).Height = 40;
((Ext.Net.RadioGroup)ctrl).LabelAlign = LabelAlign.Top;
((Ext.Net.RadioGroup)ctrl).ColumnsNumber = respuestas.Count;
bool First = true;
int radio=1;
foreach (var r in respuestas)
{
Ext.Net.Radio rdio = new Radio();
rdio.BoxLabel = r.ToString();
rdio.Width = 100;
rdio.ID = RADIO_ID + radio.ToString();
if (First)
{
rdio.Checked = true;
First = false;
}
radio++;
((Ext.Net.RadioGroup)ctrl).Items.Add(rdio);
}
But when i try to read the checked item in code behind my group doesn't have a item
p.RespuestaSeleccionada = X.GetCmp<Ext.Net.RadioGroup>(preg.ID).CheckedItems.FirstOrDefault<Ext.Net.Radio>().BoxLabel;
so who i can know the checked item?
Thanks in advance

Really, X.GetCmp() doesn't work as expected. We will investigate. (Investigated. See EDIT below the sample.)
Though, in any way, it would not give access to a Radio's BoxLabel. X.GetCmp<> just retrieve respective values from POST, but a BoxLabel is not a submitable thing. You can get access to a Radio's InputValue (or its client id if InputValue is omitted).
For now, you can retrieve the thing direct from POST.
Example
<%# Page Language="C#" %>
<%# Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void RenderRadioGroup(object sender, DirectEventArgs e)
{
RadioGroup rg = new RadioGroup()
{
ID = "RadioGroup1",
GroupName = "RadioGroup1",
ColumnsNumber = 1,
Items =
{
new Radio() { InputValue = "Radio1", BoxLabel = "Radio1" },
new Radio() { InputValue = "Radio2", BoxLabel = "Radio2" }
}
};
rg.Render(this.Form);
}
[DirectMethod]
public void GetCheckedItems()
{
X.Msg.Alert("GetCheckedItems", Request.Params["RadioGroup1"]).Show();
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:Button runat="server" Text="Render a RadioGroup" OnDirectClick="RenderRadioGroup" />
<ext:Button runat="server" Text="Get CheckedItems" Handler="App.direct.GetCheckedItems();" />
</form>
</body>
</html>
EDIT
Unfortunately, X.GetCmp() can't work. It can work only if populate a created RadioGroup's Items with all its Radio created by X.GetCmp(), but it is too cumbersome. So, getting a value direct from POST looks the only appropriate solution.

These links are worth a check. same sort of questions were asked
ext-net-radiogroup-checkeditems-is-always-null
ext-radiogroup-how-to-access-the-value-of-selected-radio-button

Related

Saving Clipboard PrintScreen to Image File in C#

I am trying to use Visual Studio C# to printscreen, then save the screen capture to a file.
Currently, I am having problems reading from the clipboard.
I have tried using both of the following lines to save a screen capture to the clipboard:
SendKeys.SendWait("+{PRTSC}");
SendKeys.SendWait("{PRTSC}");
However, when I try to save the image using the following lines, I get a Null Reference Exception.
How to do resolve this?
My code below
markup code
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2>Welcome to ASP.NET!
</h2>
1. Copy image data into clipboard or press Print Screen
<br />
2. Press Ctrl+V (page/iframe must be focused):
<br />
<br />
<canvas style="border: 1px solid grey;" id="cc" width="200" height="200">
<script type="text/javascript">
var canvas = document.getElementById("cc");
var ctx = canvas.getContext("2d");
//=== Clipboard ===============================
window.addEventListener("paste", pasteHandler); //chrome
//handler
function pasteHandler(e) {
if (e.clipboardData == false) return false; //empty
var items = e.clipboardData.items;
if (items == undefined) return false;
for (var i = 0; i < items.length; i++) {
if (items[i].type.indexOf("image") == -1) continue; //not image
var blob = items[i].getAsFile();
var URLObj = window.URL || window.webkitURL;
var source = URLObj.createObjectURL(blob);
paste_createImage(source);
}
}
//draw pasted object
function paste_createImage(source) {
var pastedImage = new Image();
pastedImage.onload = function () {
ctx.drawImage(pastedImage, 0, 0);
}
pastedImage.src = source;
}
</script>
</canvas>
<br />
</div>
<div>
<asp:Button ID="btn" runat="server" OnClick="btn_Click" Text="Go" />
</div>
</form>
</body>
</html>
code-behind
protected void btn_Click(object sender, EventArgs e)
{
var path = new[] { #"C:\Users\A\source\repos\CopyPaste\public",
#"C:\Users\A\source\repos\CopyPaste\public" }.First(p => Directory.Exists(p));
var prefix = "css-social-media-icon-list";
var fileName = Enumerable.Range(1, 100)
.Select(n => Path.Combine(path, $"{prefix}-{n}.png"))
.First(p => !File.Exists(p));
Clipboard.GetImage().Save(fileName, ImageFormat.Png);
Clipboard.SetText($"![image](/public/{Path.GetFileName(fileName)})");
}
I hope this helping... following this example

Set checkbox as checked in Repeater/CheckboxList

I'm using a Repeater to show some data coming from a web service.
My Repeater structure is:
<asp:Repeater ID="rptgrp" runat="server">
<ItemTemplate>
<asp:CheckBoxList ID="chkBoxListGoup" runat="server"
DataSource='<%# DataBinder.Eval(Container.DataItem, "Titles")%>'
DataTextField="Title"
DataValueField="IDTitle">
</asp:CheckBoxList>
</ItemTemplate>
</asp:Repeater>
Now, my web service returns these fields in "Titles":
1) Title
2) IDTitle
3) isUserTitle
Now, I would like to set checked a checkbox when isUserTitle is = 1.
How can I do that?
You can find checkboxlist as follows
Find checkboxlist in itemdatabound,
check item text of every checkboxlist using loop,
select the item whose text is 1
Protected void Repeater_ItemDataBound(Object Sender, RepeaterItemEventArgs e) {
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
CheckBoxList chklst = (CheckBoxList)e.Item.FindControl("chkBoxListGoup");
for (int i = 0; i < chk.Items.Count; i++)
{
if (chk.Items[i].Text == "1")
{
chk.Items[i].Selected = true;
}
}
}
}
Try changing <asp:CheckBoxList ID="chkBoxListGoup" runat="server"
to
<asp:CheckBoxList ID="chkBoxListGoup" Checked='<%#Eval("Flag")%>' runat="server"
Flag being your Column..
Then in your method or event handler you want to run some code to say if this value = 1 checked, elseif value = 0 unchecked...
Here is sample code that demonstrates the idea:
Code-behind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.UI.WebControls;
using WebApp.RepeaterCheckboxList.TODODatasetTableAdapters;
namespace WebApp.RepeaterCheckboxList
{
public partial class WebForm1 : System.Web.UI.Page
{
IEnumerable<TODODataset.TasksViewRow> view;
IEnumerable<TODODataset.TasksViewRow> subview;
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
TasksViewTableAdapter adp = new TasksViewTableAdapter();
var dt = adp.GetData();
view = dt.AsEnumerable();
var names = (from x in view
select new
{
Person = x.Name,
ID = x.PersonID
}).Distinct();
DataList1.DataSource = names;
DataList1.DataBind();
}
}
protected void CheckBoxList1_DataBound(object sender, EventArgs e)
{
CheckBoxList theList = (CheckBoxList)sender;
var person = ((DataListItem)theList.Parent).DataItem as dynamic;
var name = person.Person;
var id = person.ID;
var vw = subview;
for (int i = 0, j = vw.Count(); i < j; i++)
{
var task = vw.ElementAt(i);
theList.Items[i].Selected = task.Completed;
}
}
protected IEnumerable<TODODataset.TasksViewRow> GetTasks(object data)
{
var vw = data as dynamic;
return subview = (from x in view
where x.PersonID == vw.ID
select x);
}
}
}
Aspx:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApp.RepeaterCheckboxList.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DataList ID="DataList1" runat="server">
<ItemTemplate>
<div style="padding:5px">
<h3><%# Eval("Person") %></h3>
<div>
<asp:CheckBoxList OnDataBound="CheckBoxList1_DataBound" ID="CheckBoxList1"
runat="server"
DataTextField="TaskDesc" DataValueField="TaskID"
DataSource="<%# GetTasks(Container.DataItem) %>"></asp:CheckBoxList>
</div>
</div>
</ItemTemplate>
</asp:DataList>
</div>
</form>
</body>
</html>
If you are interested in the data, click here
Try just setting the Checked value to the object being Evaled.
<asp:Repeater ID="rptgrp" runat="server">
<ItemTemplate>
<asp:CheckBoxList ID="chkBoxListGoup" runat="server"
Checked=<%# Eval("isUserTitle") %>>
</asp:CheckBoxList>
</ItemTemplate>
</asp:Repeater>

I want to search and find the location and weather details in weather map

I have added one text box and search button into this application.I want enter a location and click search button then it shows the appropriate location with weather details. I tried in many ways but won't works. So any one have the code, then please share with me.
Thank you.
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<meta charset="utf-8">
<title>Weather layer</title>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=weather"></script>
<script>
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(12.9667, 77.5667),
zoom: 6,
mapTypeId: google.maps.MapTypeId.WeatherLayer
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var weatherLayer = new google.maps.weather.WeatherLayer({
temperatureUnits: google.maps.weather.TemperatureUnit.FAHRENHEIT
});
weatherLayer.setMap(map);
var cloudLayer = new google.maps.weather.CloudLayer();
cloudLayer.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="map-canvas"style="height:400px;width:400px;"></div>
<asp:Button ID="Button1" runat="server" Text="Proceed" />
<input id="searchTextField" type="text" size="50"style="height:auto;width:320px;">
</form>
</body>
</html>
Instead of removing your column, you can hide it by
protected void Button4_Click(object sender, EventArgs e)
{
GridView1.Columns[2].Visible = False;
}
However, since its giving you an Index was out of range exception, the third column might not exist in your grid. Seems like you want to hide the second column and so you should write
GridView1.Columns[1].Visible = False;
since the index of grid columns start from zero.

How to get return value (value type is Ext.Net.Panel) from DirectMethod in javascript and add it to a Ext.Net.TabPanel?

Ext.net v2.2
.Net Framework v4.5
My Direct Method
[DirectMethod]
public static Panel AddTab(int postId)
{
var pnlEditPost = new Panel
{
ID = postId.ToString(),
Icon = Icon.BookEdit,
Title = "Edit",
Layout = "Fit",
Closable = true,
AutoDoLayout = true
};
return pnlEditPost;
}
I need get the pnlEditPost in javascript and add it to my TabPanel
The exact answer is no way to return a Panel instance.
But you can return a string with a Panel's config.
<%# Page Language="C#" %>
<%# Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
[DirectMethod]
public static string AddTab(int count)
{
return ComponentLoader.ToConfig(new Ext.Net.Panel
{
Title = "Tab " + count,
Html = "Server time: " + DateTime.Now.ToLongTimeString()
});
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
<script>
var addTab = function () {
var tabPanel = App.TabPanel1;
App.direct.AddTab(tabPanel.items.getCount(), {
success: function (result) {
var tabs = tabPanel.add(eval(result));
tabPanel.setActiveTab(tabs[0]);
}
});
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:Button runat="server" Text="Add tab" Handler="addTab" />
<ext:TabPanel ID="TabPanel1" runat="server" />
</form>
</body>
</html>
Also you might be interested to look at this example.

Dynamic data entry form

I have been searching around and I am lost on how to do what I am attempting to do.
I am trying to create a form where the first column is a list of names, and the next column is all dropdown lists. The idea is that for each name the user will pic a value. Each name may require two, or three or more values. I want to create a dynamic form where a user can click add in the row and another dropdown list appears.
Ex.
"Name" | Add Button | DropDown
then when I click add...
"Name" | Add Button | DropDown | DropDown
and have it keep going.
I am able to create the form and I have it working creating the dropdown lists. The problem is that I am adding the controls on the ItemCommand of a repeater, so they must be recreated every time. Because of this I cannot find a way to keep the values selected in each dropdown, when I have to recreate them.
Typically no more than two dropdowns are required but there are a few cases where three is needed, and it could arise for more. I would like to keep this dynamic as possible.
I know that if I added the dropdown's in the page Init they would be persisted on the postback, but at least in my design the user has to click add to get another drop down.
Is there a way to capture the data from these dropdowns then reload them every time? Or a better way to achieve this functionality?
Thank You for your help.
Here is some of the asp and code behind that I am using. This is functioning as I wish, but I don't know how to keep the data on a postback, as all of the dropdown lists I add are lost.
ASP:
<table>
<asp:Repeater ID="repChemicals" runat="server" OnItemCommand="repChemicals_OnItemCommand">
<ItemTemplate>
<tr>
<td>
<asp:HiddenField ID="hfNumber" runat="server" />
<%# Eval("ChemicalName") %>
</td>
<td>
<asp:Button runat="server" ID="btnAdd" Text="Add" CommandArgument="ADD" />
</td>
<td>
<div id="divContainer" runat="server">
<asp:DropDownList runat="server" Width="60px" ID="ddlTest"></asp:DropDownList>
</div>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
C#:
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
List<Chem> Chemicals = new List<Chem>();
Random rnd = new Random();
for (int z = 0; z <= 10; z++)
{
List<string> t = new List<string>();
Chem a = new Chem()
{
ChemicalName = "Chemical" + z.ToString()
};
Chemicals.Add(a);
}
repChemicals.DataSource = Chemicals;
repChemicals.DataBind();
}
}
public void repChemicals_OnItemCommand(object sender, RepeaterCommandEventArgs e)
{
int number = 0;
foreach (RepeaterItem i in repChemicals.Items)
{
HiddenField hf = (HiddenField)repChemicals.Items[i.ItemIndex].FindControl("hfNumber");
if (i.ItemIndex == e.Item.ItemIndex)
{
if (!string.IsNullOrWhiteSpace(hf.Value))
{
number = Convert.ToInt16(hf.Value) + 1;
}
else
{
number = 1;
}
hf.Value = number.ToString();
}
else
{
if (!string.IsNullOrWhiteSpace(hf.Value))
{
number = Convert.ToInt16(hf.Value);
}
else
{
number = 0;
}
}
for (int x = 0; x < number; x++)
{
DropDownList ddl = new DropDownList();
ddl.Style.Add("width", "60px");
ddl.ID = "ddl" + i.ToString() + x.ToString();
ddl.Style.Add("Margin-right", "3px");
ddl.Attributes.Add("runat", "server");
ddl.DataSource = DataSource();
ddl.DataBind();
Control c = repChemicals.Items[i.ItemIndex].FindControl("divContainer");
c.Controls.Add(ddl);
}
}
Some of the loops are for creating test data. Basically I am storing a number of dynamic controls on each row in a hiddenfield. Then on the item command I loop through all of the rows and recreate all of the previously existing ddl's, and add one to the row that teh command came from.
This isn't exactly answering your question, but it accomplishes your ultimate goal in a less complex way and one that takes advantage of built in ASP.NET controls so maintaining state between postbacks is taken care of for you.
It utilizes jQuery, jQuery UI and a DropDownChecklist plugin.
ASPX
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/ui.dropdownchecklist.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/base/jquery-ui.css"/>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<asp:Repeater ID="repChemicals" runat="server">
<ItemTemplate>
<tr>
<td>
<%# Container.DataItem %>
</td>
<td>
<div id="divContainer" runat="server">
<asp:ListBox ID="lstAttributes" SelectionMode="Multiple" runat="server"></asp:ListBox>
</div>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
<asp:Button ID="btnPostback" Text="Postback" runat="server"/>
</div>
</form>
</body>
</html>
C#
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace PersonAttributes
{
public partial class People : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
repChemicals.ItemCreated += RepChemicalsOnItemCreated;
var chemicals = new[] {"Hydrogen", "Helium", "Lithium", "Beryllium", "Boron"};
if(!IsPostBack)
{
repChemicals.DataSource = chemicals;
repChemicals.DataBind();
}
var dropDownChecklist = "$(document).ready(function () { $('select').dropdownchecklist(); });";
ScriptManager.RegisterStartupScript(this,GetType(),"initDropDownChecklist",dropDownChecklist,true);
}
private void RepChemicalsOnItemCreated(object sender, RepeaterItemEventArgs repeaterItemEventArgs)
{
var lst = repeaterItemEventArgs.Item.FindControl("lstAttributes") as ListBox;
if (lst == null)
return;
lst.DataSource = new[] {"Option 1", "Option 2", "Option 3"};
}
}
}
See it in action at CodeRun.

Categories