how to use updatepanel in repeater? - triggers

I have to use updatepanel in repeater. When I change values in textbox, I want to see change eval("fiyat") values without postback.
<asp:ScriptManager ID="gel" runat="server"></asp:ScriptManager>
<asp:Repeater ID="tum_sepet" runat="server" OnItemCreated="tum_sepet_ItemCreated">
<ItemTemplate>
<tr>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<td style="width: 147px; vertical-align: top; text-align: center; border-bottom: 2px solid #dbdbdb;">
<div class="ok_sepet_urun_fiyat"><%# Convert.ToDecimal ( Eval("fiyat")).ToString("#,##0.00") %> <%# Eval("parabirim") %></div>
</td>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="TextBox1" />
</Triggers>
</asp:UpdatePanel>
</tr>
</ItemTemplate>
</asp:Repeater>
Code
protected void tum_sepet_ItemCreated(object sender, RepeaterItemEventArgs e)
{
var control = e.Item.FindControl("TextBox1");
ScriptManager.GetCurrent(Page).RegisterAsyncPostBackControl(control);
}
I make this process in .cs eval("fiyat") = price * number(TextBox1.Text).
Any Ideas ?

Related

Using dropdown to fill a field instead of listening

I have had some help from here and a few places to build out a wonderful email signature generator. Currently any filled in info goes into the live preview. What I am trying to do now is fill out the live preview via dropdown.
In this example I am trying to allow a user to choose "fax" or "mobile" for a phone type. The goal being that it simply fills in the "f:" or "m:" in the live preview. I broke the code down just to this key element so you can see. The dropdown is the only thing I am trying to solve.
Hoping someone can guide me to where to at least look for a solution. I have experimented quite a bit with no luck.
// We wrap our segment in an anonymous wrapper function to mitigate potential conflicts with any potential third party stuff.
(function() {
// Loading animation
window.onload = function() {
setTimeout(function() {
document.querySelector('.loading-screen').style.display = 'none';
}, 1000);
}
// Adding the error validation
const inputs = document.querySelectorAll('input,select'),
submitBtn = document.getElementById('generateButton'),
signatureForm = document.getElementById('signatureForm'),
mobileselectPhoneInput = document.getElementById('mobileselect_phone'),
mobilePhoneInput = document.getElementById('mobile_phone'),
mobileBlock = document.getElementById('mobile_phone_block'),
faxPhoneInput = document.getElementById('fax_phone'),
faxBlock = document.getElementById('fax_phone_block'),
inputFields = document.querySelectorAll('[data-field]'),
socialFields = document.querySelectorAll('[data-social]'),
awardFields = document.querySelectorAll('[data-award]'),
outputBox = document.getElementById('output-code-box'),
previewBox = document.getElementById('signature-block'),
getColumn = (id) => document.querySelector(`[data-column="${id}"]`);;
for (let i = 0, x = inputs.length; i < x; i++) {
inputs[i].addEventListener('blur', function(ev) {
if (!this.classList.contains('blurred')) {
this.classList.add('blurred');
}
mobileBlock.style.display = mobilePhoneInput.value !== '' ? 'inline' : 'none';
faxBlock.style.display = faxPhoneInput.value !== '' ? 'inline' : 'none';
socialFields.forEach(social => {
getColumn(social.id).style.display = social.value !== '' ? 'inline-block' : 'none';
})
}, false);
}
inputFields.forEach(field =>
field.addEventListener('keyup', (ev) => {
mobileBlock.style.display = ev.target.id === 'mobile_phone' || mobilePhoneInput.value !== '' ? 'inline' : 'none';
getColumn(ev.target.id).innerText = ev.target.value;
faxBlock.style.display = ev.target.id === 'fax_phone' || faxPhoneInput.value !== '' ? 'inline' : 'none';
getColumn(ev.target.id).innerText = ev.target.value;
switch (ev.target.id) {
case 'email':
getColumn(ev.target.id).href = `mailto:${ev.target.value}`;
break;
case 'office_address':
getColumn(ev.target.id).href = `https://maps.google.com/maps?q=${ev.target.value}`;
break;
case 'web_address':
getColumn(ev.target.id).href = `https://${ev.target.value}`;
break;
case 'office_phone':
getColumn(ev.target.id).href = `tel:${ev.target.value}`;
break;
case 'mobile_phone':
getColumn(ev.target.id).href = `tel:${ev.target.value}`;
break;
case 'fax_phone':
getColumn(ev.target.id).href = `tel:${ev.target.value}`;
break;
}
}, false)
);
handleForm = (ev) => {
if (signatureForm.checkValidity()) {
// minify the html to tidy up and present it for user.
outputBox.value = previewBox.innerHTML.replace(/>\s+|\s+</g, function(m) {
return m.trim();
});
document.getElementById('output-code').style.display = 'block';
} else {
// Todo - do something less obnoxious to hold their hand and tell them something is wrong maybe disable the button until valid.
alert('Missing required fields in the form.')
console.log('Missing required fields, no soup for you.')
}
};
copyCode = () => {
outputBox.select();
document.execCommand('copy');
}
})();
<!DOCTYPE html>
<html lang="en-us" dir="ltr">
<head>
</head>
<body>
<main role="main">
<section class="expository" role="region" aria-label="expository">
<section id="generator-container" role="group">
<div style="background-color: #F2F2F2; padding: 20px; margin-right: 60px;">
<h2>1. Enter as much of the below information as you can for your email signature.</h2>
<form method="POST" action="." enctype="application/x-www-form-urlencoded" role="form" id="signatureForm">
<p id="formErrorContainer"></p>
<span class="required-mark">Name</span>
<label for="name">
<input data-field type="text" id="name" name="name" title="Enter name" placeholder="e.g. John Doe" pattern="^([^0-9]*)$" autofocus required>
<span>Enter valid name</span> <span class="success-validation-check"></span>
</label>
<span class="required-mark">Job Title</span>
<label for="position">
<input data-field type="text" id="position" name="position" title="Enter position" placeholder="e.g. Care Planner" pattern="^([^0-9]*)$" required>
<span>Enter valid title</span> <span class="success-validation-check"></span>
</label>
<span role="presentation" class="required-mark">Office Phone Number</span>
<br><br>
<p style="text-align: left; color: #373737; font-size: 12px;"></p>
<br>
<label for="office_phone">
<input data-field type="tel" id="office_phone" name="office_phone" title="Enter office phone number" placeholder="e.g. 1.855.983.4663">
<span>Enter valid phone number</span> <span class="success-validation-check"></span>
</label>
<span style="font-weight: bold">Phone type</span>
<label for="mobileselect_phone">
<select data-field type="text" id="mobileselect_phone" name="mobileselect_phone" title="Mobile/fax">
<option value="None" selected>None</option>
<option value="m:">mobile</option>
<option value="f:">fax</option></select>
<span>mobile or fax?</span> <span class="success-validation-check"></span>
</label>
<label for="mobile_phone">
<input data-field type="tel" id="mobile_phone" name="mobile_phone" title="Enter phone number" placeholder="e.g. 555.123.4567">
<span>Enter valid phone number</span> <span class="success-validation-check"></span>
</label>
<div id="generator-output">
<h2>2. Live Signature Preview</h2>
<br>
<br>
<hr style="height:0;border:0;border-bottom: #ddd 1px solid"><br>
<aside id="generator-output-window">
<figure id="signature-block">
<table width="525" style="width: 525px; color: #063852; font-size: 10pt;" cellspacing=0 cellpadding=0 border=0>
<tbody>
<tr>
<td style="width: 200px;" align="center" valign=middle width="200">
<img width="200" height="79" border=0 src="assets/logo.gif"><br>
<br>
</td>
<td style="width: 325px; padding-left: 20px; border-left: #888a8d 1px solid" valign=top>
<table cellspacing=0 cellpadding=0 border=0>
<tbody>
<tr>
<td height="25" style="font-size: 14pt; font-weight: 600; font-family: georgia; color: #063852" data-column="name"></td>
</tr>
<tr>
<td style="color: #063852; font-size: 10pt !important; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif'; font-weight: 600;" data-column="position">
</td>
</tr>
</tbody>
</table>
<br>
<table cellspacing=0 cellpadding=0 border=0>
<tbody>
<tr style="vertical-align: middle;">
<td>
<a data-column="email" style="font-size: 10pt !important; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif'; text-decoration:none !important; color: #063852 !important;"></a>
</td>
</tr>
<tr height="23" style="vertical-align: middle;">
<td>
<span style="font-size: 10pt !important; font-weight: 600;">t:</span>
<a style="color: #063852 !important; font-size: 10pt !important; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif'; text-decoration:none !important;" data-column="office_phone"></a>
<span id="mobile_phone_block" style="display: none">
| <span style="font-size: 10pt !important; font-weight: 600;" data-column="mobileselect_phone"></span>
<a style="color: #063852 !important; font-size: 10pt !important; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif'; text-decoration:none !important;" data-column="mobile_phone"></a>
</span>
<span id="fax_phone_block" style="display: none">
<br><span style="font-size: 10pt !important; font-weight: 600;">f: </span>
<a style="color: #063852 !important; font-size: 10pt !important; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif'; text-decoration:none !important;" data-column="fax_phone"></a>
</span>
</td>
</tr>
</tbody>
</table>
<br>
<table cellspacing=0 cellpadding=0 border=0>
<tbody>
<tr style="text-align: left; vertical-align: middle;">
<td style="font-weight: 600; font-size: 10pt !important; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif'; color: #063852 !important;" data-column="office_name">
<font size="2">
</td>
</tr>
<tr height="23" style="vertical-align: middle;">
<td>
<a style="text-decoration:none !important; color: #063852 !important; font-size: 10pt !important; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif';" data-column="office_address"></a>
</td>
</tr>
<tr style="vertical-align: middle;">
<td>
<a style="text-decoration: none !important; color: #063852 !important; font-size: 10pt !important; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif';" data-column="web_address"></a>
</td>
</tr>
</tbody>
</table>
<br>
</td>
</tr>
<tr>
<td colspan="2" style="padding-top: 20px">
<table cellspacing=0 cellpadding=0 border=0>
<tbody>
<tr>
<td width="525" data-column="corporate" style="display:none; width: 525px; margin-bottom: 20px;"><img src="./assets/images/Awards_Corporate.gif" alt="Franchisees Choice 2020" width=525 style="width: 525px;"></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr style="vertical-align: bottom;">
<td style="padding-left: 10px; padding-right: 0px;" colspan="2">
<p><span style="text-decoration:none !important; color: #063852 !important; font-size: 10pt; font: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif'; padding-bottom: 80px;" colspan="2" data-column="extra_legal"></span></p>
<br>
</td>
</tr>
</tbody>
</table>
</figure>
<!-- <button type="button" onclick="handleForm()" style="width:100%;max-width:100%" id="generateButton">Generate Email Signature</button> -->
<div id="output-code" style="margin-top: 2rem;display:none">
<label style="text-align:left">Copy and paste the code into your email signature:</label>
<button type="button" form="signatureForm" onclick="copyCode()" style="width:100%;max-width:100%">Copy The Code</button>
<textarea id="output-code-box" name="output-code" rows="8" style="width: 100%">
</textarea>
</div>
</aside>
</div>
</form>
</div>
</section>
</section>
<!--/ End Main Form -->
</main>
<script></script>
</body>
</html>

OL Office 365 (Win 10) email circle and border issue

<!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://www.EXAMPLE.com/" style="text-align: center;font-size: 14px;height: 143px;width: 143px;" arcsize="50%" strokecolor="#fbe2a6" strokesize="4px" stroke="f" fillcolor="#f7c54d">
<w:anchorlock/>
<center style="color:#ffffff;font-family:sans-serif;font-size:13px;">
<div class="yellow-circle">
<div class="number" style="color: #fff;font-weight: 700;font-size: 24px;line-height: 1;padding-bottom: 2px;">#1</div>
<div class="round-title" style="font-size: 11px;font-weight: 700;color: #1f3b85;margin-bottom: 5px;">Top Performers<br>on Social Mobility</div>
<div class="round-title-small" style="color: #1f3b85;font-size: 11px;">2021 US News<br> World Report</div>
</div>
</center>
</v:roundrect>
<![endif]-->
<!--[if !mso]> <!-->
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody>
<tr>
<td style="text-align: center;background: #f7c54d;font-size: 14px;height: 143px;padding: 0 6px 5px;border-radius: 50%;border: 4px solid #fbe2a6;">
<div class="yellow-circle">
<div class="number" style="color: #fff;font-weight: 700;font-size: 26px;line-height: 1;padding-bottom: 2px;">#1</div>
<div class="round-title" style="font-size: 13px;font-weight: 700;color: #1f3b85;margin-bottom: 5px;">Top Performers<br>on Social Mobility</div>
<div class="round-title-small" style="color: #1f3b85;font-size: 13px;">2021 US News<br> World Report</div>
</div>
</td>
</tr>
</tbody>
</table>
<!-- <![endif]-->
design
now it is look like this
how to add stroke like in design

Instead of strokesize="4px" use strokeweight="4px".
However, you generally want to use points not pixels for Vomit Language (VML). 4px = 4 x 0.75 = 3pt. "Using points also ensures the border will resize properly in Outlook 120DPI." (https://github.com/hteumeuleu/email-bugs/issues/86)
Also, stroke="f" turns off the stroke (and it should be stroked with a d). So change to stroked="true". (HT: https://www.goodemailcode.com/email-enhancements/svg-to-vml, and includes further spec details)

export <td> with two lines to pdf using itextsharp

I am having trouble exporting to pdf if I have a two lines in a td. Can you please advise. the code is as follows:
.style7
{
font-weight: bold;
display:block;
}
.style8
{
font-size: smaller;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Panel ID="pnlPerson" runat="server" style="margin-right: 3px" Width="1045px">
<div class="style3"><strong>MAINTENANCE ENGINEERING CALL (MEC)</strong></div>
<table border="1"
style="font-family: Arial; font-size: 10pt; width: 1048px; height: 390px;">
<tr>
<td><span class="style7">Shop Submittal Date</span>
<span="style8"><asp:TextBox ID="Sdate" runat="server"></asp:TextBox></span>
</td>
</tr>
Thank you so much.

overlapping of panels (ascx) in IE7

I have the problem of panel overlapping in IE7 whereas the same code works in IE8.
Has anyone faced this kind of problem?
In the code below, i have a link button, on clicking this, the products frame would be displayed. But this overlaps with the "client products" :
<%# Control Language="C#" AutoEventWireup="true" CodeFile="ClientSummary.ascx.cs" Inherits="ClientSummary" %>
<%# Register Src="~/Controls/ClientSession/CounselorMenuFrame.ascx" TagName="CounselorMenuFrame" TagPrefix="UCC" %>
<%# Register Src="~/Controls/ClientSession/ProductsFrame.ascx" TagName="ProductsFrame" TagPrefix="UCC" %>
<%# Register Src="~/Controls/ClientSession/ProductDetailFrame.ascx" TagName="ProductDetailFrame" TagPrefix="UCC" %>
<%# Register Src="~/Controls/ClientSession/ClientDetailFrame.ascx" TagName="ClientDetailFrame" TagPrefix="UCC" %>
<asp:Panel ID="pnlClntSummary" runat="server" EnableViewState="true" >
<asp:Panel ID="pnlClientDetailFrame" runat="server" Style="width: 950px;" >
<UCC:ClientDetailFrame id="clientDetailFrame" runat="server" />
</asp:Panel>
<asp:Panel ID="pnlProductDetailFrame" runat="server" Style="width: 950px;" >
<UCC:ProductDetailFrame id="productDetailFrame" runat="server"/>
</asp:Panel>
<div id="slider" style="width:950px;">
asp:Panel ID="pnlProductsFrame" runat="server" Style="width: 950px;" >
<table style="width:900px;" >
<tr><td></td><td>
<asp:LinkButton Text="Client Information" ID="clientDetail" Font-Underline="true"
Font-Bold="true" Font-Names="Calibri" Font-Size="Medium" runat="server"
onclick="clientDetail_Click"/>
</td>
</tr>
<tr>
<td valign="top" style="float:left" align="left">
<div style="float:left;vertical-align:top;">
<div id="content" class="contentMenu">
<UCC:ProductsFrame id="productsFrame" runat="server" />
</div>
</div>
</td>
<td valign="top" style="width:900px;" align="left">
<div id="header1" style="float:left;position:relative;width:45px;">
<table border="0">
<tr>
<td valign="top" style="width:30px;"
onclick="verticalprocessClick(document.getElementById('header1'))">
<div style="padding: 2px; cursor: pointer; vertical-align: top;">
<div style="float: left; vertical-align: bottom;">
<table>
<tr onclick="ImageChangePFrame(imgPF)">
<td class="VerticalLine">
</td>
<td>
<img id="imgPF" src="../Images/icon_expand.png" alt="(Show Details...)"
onload="ProductFrameHide(this)"/>
<div id="divClientProducts" runat="server"
style="float:left;font-family:Calibri;top:1%;left:25%;position:relative;font-size:13px;
color:Gray;text-align:center;">
C<br />
L<br />
I<br />
E<br />
N<br />
T<br />
<br />
P<br />
R<br />
O<br />
D<br />
U<br />
C<br />
T<br />
S<br />
</div>
</td>
<td class="VerticalLine">
</td>
</tr>
</table>
</div>
</div>
</td>
<td>
</td>
</tr>
</table>
</div>
<div id="divTransactionDesktop" style="float:left;width:600px; height:100px;" >
<asp:UpdatePanel ID="updatePanel" runat="server" UpdateMode="conditional" ChildrenAsTriggers="false">
<ContentTemplate>
<asp:PlaceHolder ID="MainFrameHolder" runat="server"></asp:PlaceHolder>
</ContentTemplate>
</asp:UpdatePanel>
<asp:HiddenField ID="hdnRowValue" runat ="server" Value="0" />
</div>
</td>
</tr>
</table>
</asp:Panel>
</div>
<asp:HiddenField ID="hdnLastFocus" runat="server" />
<asp:HiddenField ID="hdnKeyMapping" runat="server" />
</asp:Panel>

I found a solution for overlapping of panels in IE7. It was the height attribute which made a difference. Removing the height attribute or mentioning the exact value in pixels, solves this problem.

Web Parts in ASP.NET 3.5

I'm trying to create draggable web parts in ASP.NET 3.5 but the thing just doesn't want to be dragged. I already tried the workarounds for making it compatible with Firefox, by using AJAX, but still doesn't work.
This is code I have on my page:
<asp:WebPartManager ID="WebPartManager1" runat="server">
</asp:WebPartManager>
<uc2:DisplayModeMenu ID="DisplayModeMenu1" runat="server" />
<div>
<table>
<tr>
<td>
<asp:WebPartZone ID="SidebarZone" runat="server" HeaderText="Sidebar">
<ZoneTemplate>
<asp:Label runat="server" ID="linksPart" title="My Links">
ASP.NET site
<br />
GotDotNet
<br />
Contoso.com
<br />
</asp:Label>
<uc1:SearchUserControl ID="SearchUserControl1" runat="server" title="Search" />
</ZoneTemplate>
</asp:WebPartZone>
</td>
<td>
<asp:WebPartZone ID="MainZone" runat="server" HeaderText="Main">
<ZoneTemplate>
<asp:Label ID="lbl" Text="Some text" Title="Content" runat="server"></asp:Label>
</ZoneTemplate>
</asp:WebPartZone>
</td>
<td>
<asp:EditorZone ID="EditorZone1" runat="server">
<ZoneTemplate>
<asp:AppearanceEditorPart ID="AppearanceEditorPart1" runat="server" />
<asp:LayoutEditorPart ID="LayoutEditorPart1" runat="server" />
</ZoneTemplate>
</asp:EditorZone>
</td>
</tr>
</table>
</div>
I never get the drag cursor when I hover the titles.
Any idea on what I may be doing wrong?
EDIT:
I am in the page in Edit mode, not Browse mode....
Tks in advance.

As a reference, I solved the problem by adding a css to the div containing the web part controls:
<style type="text/css">
.container
{
padding: 0px;
margin-top: 5px;
margin-left: 20px;
margin-bottom: 0px;
/* position: relative; */
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #333333;
height: 550px;
width: 990px;
}
</style>
It has to do with the position element.
Hope it helps someone facing the same problem.